[css] z-index와 같이 가야하는 속성, position

 z-index 속성이 먹히지 않는다면 그 이유는? z-index와 같이 써줘야 할 속성 position 과 기타 규칙들에 대해 알아보자.

 

 

z-index는...

• z-index는 position 속성이 설정된 element에 대해서만 의미를 갖는다.
• z-index의 속성은 0, 양수(1 ~ 9999), 음수(-1 ~ -9999) 정수값을 가지며 z축상의 위치를 나타낸다.
• 숫자가 커질수록 가장 위에 쌓이며 기본 레이어는 0이다.

 

 

 

 

* z-index가 없는 경우 쌓임 규칙

 

 

1. 뿌리 엘리먼트의 배경과 테두리
2. 자식 엘리먼트들은 HTML에서 등장하는 순서대로 
3. position이 지정된 자식 엘리먼트들은 HTML에서 등장하는 순서대로