css中的z-index不起作用

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的后代 - >框F(z-索引:-1)覆盖框B(z-index:1),因为它是框c的后代(这个是z-指数: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-index仅适用于相对或绝对位置,这就是为什么你的其他div确实适用于您的z-index.

如果不是这种情况,我会说你没有正确构建HTML.

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

Answer 3

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

我认为它必须是代码中的其他内容才会发生变化.它.