是父元素本地的子元素的z-index？

Question

好的，所以我在我的html

中进行了这个测试设置

<div style="position:absolute;left:0px;top:0px;z-index:1;width:200px;height:200px;background-color:red;">
<div style="position:absolute;left:0px;top:0px;z-index:3;width:50px;height:50px;background-color:green;"></div>
</div>

<div style="position:absolute;left:0px;top:0px;z-index:2;width:100px;height:100px;background-color:blue"></div>

我希望蓝色div在红色div前面渲染，但是我希望红色的子div（绿色）在蓝色前呈现，看看那个代码它似乎应该可以工作如果z-index是全局的，但它似乎是父元素的本地元素，因为蓝色呈现在红色之上，但绿色不会呈现在顶部，除非我将绿色div移出父元素？我如何使用＆＃34;全球z-index＆＃34;或者不管它是什么。对我的实际项目来说，以这种方式工作至关重要

Answer 1

Z-indices总是与最近的祖先（在这种情况下是父母）是本地的或相对的。 CSS中没有全局z-index属性。

您必须将绿色div移出其父级。