HTML에서는 z-index 속성을 통해 요소의 레벨을 설정할 수 있습니다. 이 속성은 값이 클수록 요소의 스택 순서(레벨)를 지정할 수 있습니다. , 레벨이 높을수록 값이 작아집니다.
이 튜토리얼의 운영 환경: Windows7 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.
html 레벨 설정
by z-index
进行设置,所有的元素的z-index
기본값은 0입니다.
z-index 속성은 요소의 스택 순서를 지정합니다. 더 높은 스택 순서를 가진 요소는 항상 더 낮은 스택 순서를 가진 요소 앞에 나타납니다.
z-index를 통해 서로 다른 값을 설정하여 배치된 요소 간의 적용 범위를 제어할 수 있습니다. 값이 클수록 레벨이 높아집니다. 값이 작을수록 레벨이 낮아집니다. 위치가 지정된 요소의 레벨이 -1이면 위치가 지정되지 않은 일반 요소로 덮어쓰여집니다.
예:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> <style> .one{ width: 100px; height: 200px; background: red; position: absolute; } .two{ width: 100px; height: 100px; background: yellow; position: absolute; left: 50px; z-index: 1; } .three{ width: 100px; height: 300px; background: blue; position: absolute; left: 30px; z-index: -2; } </style> </head> <body> <div></div> <div></div> <div></div> </body> </html>
추천 튜토리얼: "html 비디오 튜토리얼"
위 내용은 HTML에서 레벨을 설정하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!