CSS 我可以覆盖父元素的 z-index 继承吗?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3198947/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 22:20:41  来源:igfitidea点击:

can I override z-index inheritance from parent element?

csspositionz-index

提问by Marek

Is there any way to override z-index inheritance from parent elements when using absolute position. I want 2222 div to be on top of 0000 div:

使用绝对位置时,有什么方法可以覆盖父元素的 z-index 继承。我希望 2222 div 位于 0000 div 之上:

<div style="background-color:green; z-index:10; position:relative">
     OOOO
</div>

<div style="background-color:yellow; z-index:5; position:relative">
     1111
     <div style="position:absolute; background-color:red; 
                 z-index:15; top:-8px; left:20px">
         2222
     </div>
</div>

I can not change z-index of 0000 or 1111 divs and I am trying to position my 2222 element relative to 1111 element.

我无法更改 0000 或 1111 div 的 z-index,我正在尝试相对于 1111 元素定位我的 2222 元素。

采纳答案by Ryan Kinal

I believe z-index is relative to the nearest positioned element. So, if you had two divs inside the "1111" div, they could be z-index'd relative to each other, but since 2222 is a child of 1111, it cannot be z-indexed relative to 0000, and will always be above 1111.

我相信 z-index 是相对于最近的定位元素。因此,如果您在“1111”div 中有两个 div,它们可以相对于彼此进行 z-index,但由于 2222 是 1111 的子项,因此它不能相对于 0000 进行 z-indexed,并且将始终为1111 以上。