重叠「这是我参与11月更文挑战的第4天，活动详情查看：2021最后一次更文挑战」重叠当有多个元素重叠在一起的时候，怎

「这是我参与11月更文挑战的第4天，活动详情查看：2021最后一次更文挑战」

当有多个元素重叠在一起的时候，怎么管理元素间重叠的次序呢？

答案就是：z-index属性，它的属性值仅仅是一个数字

该属性表达的主要含义就是，你想象一条垂直穿过电脑屏幕的轴，把屏幕所在的平面当作0次序，那么值越大就越靠近屏幕，值越小就越远离屏幕。但是使用z-index属性的前提是元素被定位过（相对定位或绝对定位均可）。

z-index的默认值时auto，由此可知，那些未设置过z-index属性的元素并非位于同一平面内，它们的叠加次序就是在文档中的出现顺序。

一个主元素可以有两个伪元素，它们在DOM文档中出现的顺序为：主元素、::before伪元素、::after伪元素，因为这三者的默认叠加顺序就是主元素在最下面，::before伪元素在中间，::after伪元素在最上面。

如果主元素的z-index值设置为auto，伪元素z-index为负数，此时伪元素会在主元素下面，伪元素之间的重叠次序依旧按照z-index的值进行排序。
如果主元素z-index属性设置了确切的值，就算主元素z-index的值大于伪元素的值，主元素仍然在下面的一层。出现上述情况的原因是因为主元素和伪元素不是同级关系，所以它们之间的z-index值不能进行比较。因此，一旦主元素设置了z-index的值，不管该属性值的大小为多少，主元素都是整个容器的最下面的一层，该主元素的子元素均位于其之上。

总结就是：同一父元素下的子元素间才能比较z-index属性值的大小。