在IE7上不显示背景图像

时间:2014-02-20 19:00:38

标签: html css internet-explorer

我的页脚有一个重复的背景图像。它在现代浏览器上完美呈现。这是它在Firefox上的样子。

On Firefox

但是在Internet Explorer 7上查看时

Internet Explorer 7

这是我控制背景的代码。

CSS

#footer {
  background: transparent url("/assets/img/template/wild_oliva_dark.png") repeat scroll 0% 0%;
}
#footer {
  text-align: left;
  background-position: center;
  background-color: #1a1a1a;
}

它不在媒体查询中。

正如您所看到的,我使用ID为<div>的{​​{1}}而非使用#footer来更好地兼容旧版浏览器。我正在使用modernizr

修改
在另一位成员的建议下,我加入了Selectivizr。但我可能错误地实现了它,因为它没有成功测试。

after test

编辑2:
页脚使用响应式粘性页脚样式。不确定这些类中是否有一些影响它。

<footer>

<div id="footer" class="block"> 班有这个:

block

2 个答案:

答案 0 :(得分:0)

看起来您的背景简写顺序错误。

尝试

background: transparent url("/assets/img/template/wild_oliva_dark.png") repeat scroll 0% 0%;

答案 1 :(得分:0)

您也可以使用selectivizr作为css文件。

选择性类似的现代化者。

selectivizr是一个JavaScript实用程序,可在Internet Explorer 6-8中模拟CSS3伪类和属性选择器。只需在您的页面中包含脚本,选择将完成其余的工作。

使用选择性分步骤

1次下载selectivizr

2 - 插入标题下面的代码。

<script type="text/javascript" src="[JS library]"></script>
<!--[if (gte IE 6)&(lte IE 8)]>
  <script type="text/javascript" src="selectivizr.js"></script>
  <noscript><link rel="stylesheet" href="[fallback css]" /></noscript>
<![endif]--> 

3 - 现在你可以使用css3

兼容性Ie 6,7,8