我正在尝试让我的页脚显示在页脚背景的上面,但是z-index似乎不起作用。有人看出问题了吗?http://jsfiddle.net/f2ySC/
你必须明确地定义position
属性:
.footerBox {
background-color: #FFFFFF;
border: 10px solid #DDDDDD;
margin: 10px 0 -200px -10px;
width: 1185px;
z-index: 1000;
position:relative;
}
这将把页脚带到“当前堆叠上下文”中:
......根元素形成根堆叠上下文。其他堆叠上下文由具有计算值为“z-index”的任何定位元素(包括相对定位元素)生成,而该值不是“auto”。堆叠上下文不一定与包含块相关。在CSS的未来版本中,其他属性可能会引入堆叠上下文,例如“opacity”......
position
属性设置为 absolute
。
你的新代码应该如下所示。.footerBox {
background-color: #FFFFFF;
border: 10px solid #DDDDDD;
margin: 10px 0 -200px -10px;
width: 1185px;
z-index: 1000;
position: absolute;
}
在这里查看演示 here
使用position: relative
也可以起作用