0

我已经设置了一个背景，我希望它是其他一些 div 后面的屏幕宽度。

我已将 z-index 设置为 -1，因此它出现在 2 个 div 后面，这在 Chrome 中运行良好但是，IE 似乎在容器的宽度之前和之后（980px）切断了背景

我的代码：

.container { 
  width: 980px; 
  background: transparent; 
}
.container-footer { 
  position: relative;
  background: url(images/footer-bg.png) no-repeat center top; 
  width: 100%;
  z-index: -1;
  margin-top: -100px;
  height: 200px;
}

<div class="container"> .. content .. </div>
<div class="container container-footer"></div>
<div class="container"> .. content .. </div>

这是Chrome中的效果：

镀铬背景效果

这是 Internet Explorer 8 中的效果：

即背景效果

完整的代码可以在这里找到：http ://www.signatureblindsbrisbane.com.au/ （在底部（签名合作伙伴区域）

4

1 回答 1

0

您的 Z-index 存在一些问题。

首先，DOM 顺序最初决定了 Z-index，因此第一个 DIV 元素在底部（z-index: 1），第二个在中间（2），第三个在绝对顶部（3）。

其次，z-index 根本不起作用，除非您应用特定的位置属性（例如绝对或相对）。

于 2013-08-29T02:27:00.497 回答