css - 使用 z-index css 使元素正确分层？

Question

在此页面http://londonsitedesign.co.uk/code/basic.html我试图将图像放在全屏幻灯片上方，但在我的标题后面。图像是白色渐变。我为图像指定了 z-index: 0 样式，将其放在背景前面，但它覆盖了标题。它如何位于标题和背景之间？

我注意到标题中的菜单位于图像上，但头部中的其余元素位于白色渐变图像的后面。为什么元素的分层会有这种差异？

感谢您的任何建议。

安吉拉

score 3 · Accepted Answer

您需要添加position:relative到您的#header（以及任何其他带有z-index但未position指定的元素）：

#header {
    height: 157px;
    background-color: #FFF;
    z-index: 5;
    position: relative;
}

score 2 · Accepted Answer

这应该做你想要的：

.container_24 {position: relative; z-index: 10;}

它还将阻止页脚上的淡入淡出，我认为您也不会想要。

2 回答 2