具有“自动”以外的z索引值的定位元素和不透明度值小于1的元素将生成堆叠上下文。请参阅有关喷漆顺序的规则。
在您的第一个示例中，我们具有带有多个后代的根堆栈上下文，包括：
- 定位的Z-index为正的绿色框
- 带有
auto
z-index的蓝色框
带有
autoz-index 的蓝色框位于后面；Z索引为正的绿色框位于前面（请参见规则8和9）。
在您的第二个示例中，我们有：
- 具有不透明度的元素（包含绿色框；请注意，绿色框上的z-index对该元素而言是局部的）
- 没有z-index的定位蓝色框
这两个要素属于同一类别（见规则8）。在这种情况下，HTML顺序确定哪个元素出现在前面。蓝色框按源顺序显示在后面，因此它出现在前面。
