HTML, CSS, Z- 색인

Question

Z- 색인으로 무엇인가를 이해할 수 없습니다.이을 살펴보면 div 뒤에 숨겨진 범위가 있음을 알 수 있습니다.

나는 내가 방금 말한 것은 모두 사실 인 경우 있도록 모든 요소가, Z- 인덱스있는 유일한 요소가 z-index: 0;와 html 요소이다 그들은 부모로부터 Z- 인덱스를 상속 말한다 z-index: 'auto';을 것을 배웠습니다 요소 (with position absolute, fixed, relative)는 기본적으로 z-index: 'auto';이어야하며 기본적으로 z-index: 0;입니다. 사업부의 기본 z-index이 0 및 사업부해야하기 때문에 당신은 내가 div 요소에 대한 스팬 더 이상 숨겨져 놀랍게도 z-index: 0; 설정이 fiddle를 살펴 경우 지금

, 나는 놀랐어요 스팬을 숨겨야합니다. 나는 범위가 더 이상 숨겨진되지 div 요소에 대한 z-index: 0;을 설정할 때, 나는 스팬 더 숨길 유지한다는 의미는 이유

그래서 내 질문은?

Answer 1

희망이 도움이 될 것입니다.

기본 값 : auto

사양 기본 값에 대해 이런 말을 가지고

, auto :

현재의 스택 문맥에서 생성 된 박스의 스택 수준과 동일 박스는 새로운 로컬 스태킹 컨텍스트를 설정하지 않습니다. (CSS2.1 : 9.9.1)

즉, 다음을 의미합니다. z-index:auto의 요소를 z-index:0으로 지정하십시오. 그러나 의 차이 인은 z-index:auto이지만 스태킹 컨텍스트는 설정하지 않지만 후자는 설정합니다.

z- 색인이 auto이 아닌 요소에 의해 설정된 새로운 포함 블록으로 '스태킹 컨텍스트'라는 문구를 이해할 수 있습니다. 실제로 지금 div{z-index:auto}

스태킹의 규칙을 감안할 때, DIV의 사업부원을

1) span{z-index:-1} & 명시적인 Z- 인덱스 :

특별히 문제를 확인하려면 새로운 스태킹 컨텍스트를 설정하지 않으므로 해당 자식이 본문 요소와 동일한 스태킹 컨텍스트에 배치됩니다. 즉, 범위은 본문 요소 뒤에 있습니다.

2)이 이런 span{z-index:-1} & div{z-index:0;}

의 는 스팬DIV 아닌 초기 함유 블록의 적층 컨텍스트 임의 more.Remember이 설립 적층 컨텍스트의 일부이다. 따라서 span은 두 번째 바이올린이 보여 주듯이 스태킹 컨텍스트의 배경 아래에 결코 쌓이지 않습니다.

P. 스태킹 규칙은 CSS2.1까지는 이와 같지 않습니다. ;-)