CSS Z-index 滑动图像

Question

我的网站有点问题。

jn-racing.de

后台导航下方的“Banner”栏是一张.png图片，带有gras但滑动图片在png的前面。

滑动图像的 Z-index 为 3，css 类“banner”为 99。

背景必须在滑动图片之前。

谢谢

Answer 1

#slider 的子项和#slider 本身是定位的(相对的)，这意味着它们各自属于自己的堆叠上下文，z-index 将无效。

一个)

您需要删除位置属性。但这可能会与您定位的图像发生冲突，因此这不是一个真正的选择。

B)

您需要将草地背景驻留在与#slider 相同的堆叠上下文中，这意味着它必须在一个元素上，该元素也是#banner 的直接子元素(#slider 的兄弟)。

例子:

#slider:after {
    content: '';
    height: 10px;
    width: 1024px;
    background: url(images/banner.png) no-repeat left bottom;
}