关于 z-index 和位置

Question

我正在阅读这篇关于 z-index 的文章并有一个问题。

z-index 就像图层一样，对吗？那么图层（z-index）1应该在顶部，第二层，第三层以及上面。

为什么这张图片中的 z-index 3 大于 2？

我看到两人立场不同：

Div 3 是绝对的，因此它与其他所有内容都脱离了上下文，但这是否也适用于“图层”？

Answer 1

z-index 就像图层一样，对吗？ 是的

那么第 1 层应该位于顶部，第 2 个、第 3 个依次位于顶部。 否 - 在同一堆叠上下文中，z-index 编号较大的元素位于顶部。因此，div 1（z-index 5）比 div 3 更高（即更靠近观察者）。

为什么这张图片中的 z-index 3 大于 2？ 因为 3 大于 2

Div 3 是绝对的，因此它与其他所有内容都脱离了上下文，不完全是。它本身与 div1 和 div2 堆叠，这三个 div 位于相同的堆叠上下文中。然而，由于 div3 是绝对定位的，它形成了自己的堆叠上下文，并且它的子级堆叠在其中。