[CSS] position과 요소의 쌓임 순서


[CSS] position과 요소의 쌓임 순서

position과 요소의 쌓임 순서 - stack order? 요소가 쌓여 있는 순서를 통해 어떤 요소가 사용자와 더 가깝게 있는지(더 위에 쌓이는지)를 결정. z축. - z축: 우리의 시선과 동일한 축을 가짐. 눈에 보이지는 않지만 무언가가 더 앞에 있거나 뒤에 있는 개념. [요소의 쌓임 순서] 1. static을 제외한 position 속성의 값이 있을 경우 위에 쌓임. 값은 무관. - relative, absolute, fixed, sticky 중 값에 상관 없이 특정 값이 있으면 일단 위에 쌓이는 것. 2. position이 모두 존재한다면 z-index 속성의 숫자 값이 높을수록 위에 쌓임. 3. position 속성의 값이 있고 z-index 속성의 숫자 값이 같다면 HTML의 마지막 코드일수록 위에 쌓임. - 가장 나중에 작성된 코드/요소. ※ position > z-index > HTML 마지막 코드 [사용 예시] - 5, 4, 3, 2, 1 순서로 박스가 쌓여 있음...


#css #order #position #stack #순서 #쌓임 #요소 #요소의쌓임

원문링크 : [CSS] position과 요소의 쌓임 순서