CSS Z-index滑动图像

Question

我的网站存在问题。

  

jn-racing.de

背景导航下方的“横幅”栏是带有gras的.png图片，但滑动图片位于png的前面。

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

背景必须位于滑动图像的前面。

由于

Answer 1

#slider和#slider本身的子节点（相对），这意味着它们各自属于它们自己的堆叠上下文，而z-index将没有效果。

A）

您需要删除position-property。但这可能与您定位的图像冲突，因此这不是一个真正的选择。

B）

你需要草背景与#slider位于相同的堆叠上下文中，这意味着必须在一个元素上，这也是#banner的直接子元素（#slider的兄弟）。 / p>

示例：

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

Answer 2

你应该把草.png你的html放在#slider div下，并给它（新的img）一个ID。只要它是背景，通过css将它移到前面会更难。这有帮助吗？