CSS 참조 매뉴얼

CSS @규칙(RULES)

CSS 속성 전체

CSS z-index 속성 사용 방법 및 예제

z-index 속성은 요소의 스택 순서를 지정합니다. 더 높은 스택 순서를 가진 요소는 항상 더 낮은 스택 순서를 가진 요소 앞에 위치합니다. 주의: z-index정위치 요소(position:absolute, position:relative, 또는 position:fixed)

아래 표는 이 속성의 사용 설명과 버전 기록, 그리고 이 속성이 자바스크립트 스크립트에서 사용하는 문법을 설명합니다.

기본 값:	auto
적용:	정위치 요소
thừa kế:	없음
애니메이션 가능:	은.참조: 애니메이션 속성。
버전:	CSS 2、3

주의:요소가 중첩될 때, z-index는哪个重叠确定。-index는 일반적으로 낮은 요소가 있는 요소 앞에 위치합니다.

z-index 사용 문법

이 속성의 문법은 다음과 같습니다:

z-index: integer | auto | initial | inherit

아래 예제는 z-index 속성.

예제

　　div {
　　　position: absolute;
　　　lop:　30px;
　　　left:　30px;
　　　z-index:　2;
　　}

시험해 보세요‹/›

속성 값

아래 표는 이 속성의 값을 설명합니다.

값	설명
integer	현재 스택 컨텍스트에서 요소의 레이어 상자의 스택 레벨 순서를 설정합니다. 이 상자는 또한 스택 레벨이 0(무)인 로컬 스택 컨텍스트를 생성합니다. 음수 정수 값을 사용할 수 있습니다.
auto	요소의 레이어 상자의 스택 레벨은 부모 레이어 상자의 스택 레벨과 동일하며 새로운 스택 컨텍스트를 생성하지 않습니다. 이는 기본 값입니다.
initial	이 속성을 기본 값으로 설정합니다.
inherit	지정된 경우, 관련 요소는 부모 요소의 z-index 속성 값.

브라우저 호환성

z-index 속성의 브라우저 호환성을 확인하십시오. 아래 표의 숫자는 이 속성을 지원하는 브라우저의 최소 버전 번호를 나타냅니다; 모든 주요 브라우저는 이 속성을 지원합니다.

	파이어폭스 1+ 구글 크롬1+ 인터넷 익스플로러 4+ 애플 사파리 1+ 오페라 4+

더 읽기

다음 튜토리얼을 참조하십시오:CSS 위치，CSS 레이어。

관련 속성:position，top，right，left，bottom。

CSS 속성 전체 가이드서(기능별)CSS3 word-wrap 속성