Question

这个div

<div style="position: relative; z-index: 99;">123</div>

显示在上面

<div style="position: fixed; z-index: 3000;">456</div>

当我在第一个div中分配z-index：98时一切都很好！如果需要，我可以提供更多代码。

Answer 1

z-index定位于它的父级 - 它们是否在同一个父元素中？ z-index实现了一个自己的堆栈 - 例如：

框D，E和F是框C的后代 - ＆gt;框F（z-index：-1）覆盖框B（z-index：1），因为它是框c的后代（这个是z-index：3比框b）

<div style="position:absolute; top:100px; left:100px; z-index:2; border:1px solid #888; background:#f88;">
      <b>A:2</b>
    </div>
    
    <div style="position:absolute; top:130px; left:130px; z-index:1; border:1px solid #888; background:#88f;">
      <b>B:1</b>
    </div>
    
    <div style="position:absolute; top:190px; left:270px; width:280px; height:280px; z-index:3;
                border:1px solid #888; background:#eee;">
      <b>C:3</b>
    
      <div style="position:absolute; top:30px; left:-30px; z-index:2; border:1px solid #888; background:#8f8;">
        <b>D:2</b>
      </div>
    
      <div style="position:absolute; top:-30px; left:40px; z-index:3; border:1px solid #888; background:#ff8;">
        <b>E:3</b>
      </div>
    
      <div style="position:absolute; top:60px; left:-60px; z-index:-1; border:1px solid #888; background:#8ff;">
        <b>F:-1</b>
      </div>
    </div>

Answer 2

我认为问题可能就是

<div style="position: fixed; z-index: 3000;">456</div>

根据这个站点修正了位置：http://www.kavoir.com/2008/12/css-z-index-doesnt-work.html，z-indexes只能用于相对或绝对位置，这就是你的另一个div与你的z-index一起工作的原因。

如果情况并非如此，我会说你没有正确构建HTML。

希望你发现这个英特尔有用。

Answer 3

在这个小提琴上，它不是：http://jsfiddle.net/kcgCX/

我认为代码中的其他内容必须发生变化。它

Answer 4

Protip：如果你有一个children小的（Ej.100px的高度），并且overflow: hidden更大（Ej，200px），即使z-index设置得很好，如果容器具有属性jsoniq version "1.0"; let $users := { "name" : "Deadbeat Jim", "address" : "1 E 161st St, Bronx, NY 10451", "risk tolerance" : "high" } insert json {"status" : "credit card declined"} into $users return $users ，则子项将不会完全可见。

css中的z-index不起作用

4 个答案: