为什么z-index不适用于div？

我试图让我的页脚显示在页脚背景之上，但z-index似乎没有工作。有人看到它有什么问题吗？ http://jsfiddle.net/f2ySC/为什么z-index不适用于div？

2012-03-06 TruMan1

你必须明确定义position属性：

.footerBox { 
    background-color: #FFFFFF; 
    border: 10px solid #DDDDDD; 
    margin: 10px 0 -200px -10px; 
    width: 1185px; 
    z-index: 1000; 

    position:relative; 

}

http://jsfiddle.net/f2ySC/1/

这带来的页脚到current stacking context：

...根元素形式根堆栈上下文。其他堆栈上下文由具有除“ ”auto之外的'z-index'的计算值的任何定位元素（包括相对定位元素的相对）生成。堆叠上下文不一定与包含块有关。在将来的CSS水平，其他属性可能会引入堆叠上下文，例如“不透明” ......

http://www.w3.org/TR/CSS2/visuren.html#z-index

来源

2012-03-06 21:42:41 xandercoded

6年后，这仍然帮助我。谢谢！ – 2018-02-20 22:56:57

在footerBox设置position属性absolute 你的新代码应如下所示

.footerBox { 
    background-color: #FFFFFF; 
    border: 10px solid #DDDDDD; 
    margin: 10px 0 -200px -10px; 
    width: 1185px; 
    z-index: 1000; 
    position: absolute; 
}

看到一个演示here

我们ing position: relative也可以工作

来源

2012-03-06 21:43:21 jacktheripper

这是你要找的效果吗？ Updated example

我加position: relative;到#footerBack和.footerBox使用负保证金是不是一个好的做法，以使z-index

来源

2012-03-06 21:45:32 PatrikAkerstrand

。的z-index：-1;它只是在另一个div的背景上显示内容:)

来源

2013-06-24 10:51:41

为什么z-index不适用于div？

回答

相关问题