html - 如何使用html和css使div在另一个之上？

This question already has answers here:

div under another div
                                
                                    （5个答案）
                                
                        
                                4年前关闭。
            
                    
我正在制作一个页面，我需要一个div块进入另一个页面。我有很多不同的颜色div，当我将margin-top：100px（例如）用于一个div，将margin-top：200px用于其他div时，在我的计算机上看起来还可以，但是在笔记本电脑上却完全不同

---第一个和第二个div在正确的位置，但是我必须将第三个div放在第二个div之下。我怎样才能做到这一点？
这是图片：

最佳答案

尝试将div设置为“ position：relative”，然后设置z-index属性。设置得越低显示越远...

范例：

<div class="div1"></div>
<div class="div2"></div>
<div class="div3"></div>

然后你的CSS：

.div1 {
    position:relative;
    z-index:1;
    width: 100%;
    height: 300px;
    background-color: #eee;
}
.div2 {
    position:relative;
    z-index:2;
    margin-top: -100px;
    width: 100%;
    height: 300px;
    background-color: #f90;
}
.div3 {
    position:relative;
    z-index:3;
    margin-top: -100px;
    width: 100%;
    height: 300px;
    background-color: #ccc;
}