<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
div{
width: 200px;
height: 200px;
position: absolute;
}
.div1{
background-color: #f00;
left: 100px;
top: 100px;
z-index:2;
}
.div2{
background-color: #0f0;
left: 200px;
top: 200px;
z-index:1;
}
</style>
</head>
<body>
<div class="div1"></div>
<div class="div2"></div>
</body>
</html>
z-index结论:
●只有设置了固定定位、相对定位、绝对定位了的元素它们才会拥有z-index;
●z-index的值是没有单位的,值是一个正整数,默认的z-index的值是0;
●如果多个定位元素没有设置z-index属性或者z-index值设置一样那么写在HTML后面的定位元素就会压盖住前面的定位元素
●z-index表示谁压盖着谁,数值大的会压盖住数值小的,只有定位的元素才有z-index值;
●在使用固定定位来实现顶部导航栏添加.nav{z-index:999999999}