• 카테고리

    질문 & 답변
  • 세부 분야

    웹 개발

  • 해결 여부

    미해결

포지션(position) 속성(z-index와 포지션 속성 우선순위) 강의 질문있습니다.

22.07.08 00:29 작성 조회수 255

1

                  HTML

 <div class="box1">box1</div>

 <div class="box2">box2</div>

 <div class="box3">box3</div>

 

                  CSS

div[class*=box] {

  border: 1px solid #000;

  width: 200px;

  height: 200px;

  font-size: 2em;

  text-align: center;

  line-height: 200px;

  position: absolute;

}

저 강의에서요 box클래스명을 가진 div에 position: absolute를 주면 div3개가

한꺼번에 모이는데 왜3개가 한꺼번에 모이는지 원리를 잘 모르겠는데 궁금해요

 저 div3개 박스들이 absolute를 줘서 붕뜨는 그런 원리인가요?

답변 1

답변을 작성해보세요.

0

말그대로 absolute란 절대적으로 위치한다는 의미입니다.

absolute를 주면 기본적으로 top: 0; left: 0; 가 있습니다.

그래서 absolute를 주면 부모요소 기준으로 op: 0; left: 0;  좌표가 같기 때문에 한자리에 겹치게 됩니다.

겹치는 순서는 html 순서중에서 가장 나중에 나온 .box3 이 가장 위로 올라옵니다.