css两个div重叠

CSS是用于网页设计的一种语言，其中有一个非常常见的问题是两个div重叠的情况。下面我们来讨论一下如何解决这个问题。

 div {
        position: absolute;
        left: 0;
        top: 0;
    }
    .div1 {
        width: 100px;
        height: 100px;
        background-color: red;
    }

    .div2 {
        width: 50px;
        height: 50px;
        background-color: blue;
        left: 25px;
        top: 25px;
    } 

上面是一个简单的CSS代码，其中有两个div，分别拥有不同的背景颜色和大小。由于它们都是绝对定位，所以它们会重叠在一起。

为了解决这个问题，我们可以使用层级的概念。每个div都拥有一个z-index属性，数值越大的div会显示在数值小的div的上面。

 div {
        position: absolute;
        left: 0;
        top: 0;
    }
    .div1 {
        width: 100px;
        height: 100px;
        background-color: red;
        z-index: 1;
    }

    .div2 {
        width: 50px;
        height: 50px;
        background-color: blue;
        left: 25px;
        top: 25px;
        z-index: 2;
    } 

通过给div1和div2分别设置不同的z-index属性，我们就可以控制它们的层级关系，从而解决两个div重叠的问题。

总的来说，处理两个div重叠的情况，我们需要使用position绝对定位和z-index层级，通过这些方法可以让网页的排版更加灵活、美观。