z-index参数，决定谁在上显示，谁在下显示
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" type="text/css" href="index.css">
</head>
<body>
<div class="div0">
<div class="div1"></div>
<div class="div2"></div>
<div class="div3"></div>
</div>
</body>
</html>
index.css
div{
width: 100px;
height: 100px;
}
.div1{
background-color: red;
position: absolute;
top: 20px;
left: 100px;
/*z-index决定谁在前面显示，越大越靠上显示*/
z-index: 10;
}
.div2{
background-color: green;
position: absolute;
top: 40px;
left: 120px;
z-index: 50;
}
.div3{
background-color: blue;
position: absolute;
top: 60px;
left: 140px;
z-index: 30;
}
.div0{
height: 300px;
}
image.png
网友评论