[英]Background image not displaying on IE7
My footer has a repeating background image. 我的页脚有重复的背景图片。 It shows up perfectly on modern browsers.
它在现代浏览器中完美显示。 Here is what it looks like on Firefox.
这是在Firefox上的外观。
But then when viewing it on Internet Explorer 7 但是当在Internet Explorer 7上查看时
Here is my code that controls the background. 这是我控制后台的代码。
CSS 的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;
}
It is not in a media query. 它不在媒体查询中。
As you can see, I used a <div>
with id of #footer
instead of using <footer>
for better compatibility with older browsers. 如您所见,为了更好地与旧版浏览器兼容,我使用ID为
#footer
的<div>
而不是使用<footer>
。 I am using modernizr . 我正在使用modernizr 。
EDIT: 编辑:
At the suggestion of another member, I added Selectivizr. 在另一个成员的建议下,我添加了Selectivizr。 But I might have implemented it wrong because it did not test out successfully.
但是我可能实现错误,因为它没有成功测试。
EDIT 2: 编辑2:
The footer is using responsive sticky footer styling. 页脚使用响应式粘性页脚样式。 Not sure if some of those classes are affecting it.
不知道其中的某些类是否正在影响它。
<div id="footer" class="block">
The block
class has this: block
类具有以下内容:
.block { display: table-row; height: 1px; }
Looks like your shorthand of background is in the wrong order. 看起来您的背景速记顺序错误。
Try 尝试
background: transparent url("/assets/img/template/wild_oliva_dark.png") repeat scroll 0% 0%;
Also you can use selectivizr for your css file. 您也可以将selectivizr用于CSS文件。
The selectivizr similar modernizr. 选择相似的现代化。
selectivizr is a JavaScript utility that emulates CSS3 pseudo-classes and attribute selectors in Internet Explorer 6-8. selectivizr是一个JavaScript实用程序,它可以在Internet Explorer 6-8中模拟CSS3伪类和属性选择器。 Simply include the script in your pages and selectivizr will do the rest.
只需将脚本包含在页面中,其余的将由selectivizr完成。
. 。
Step-By-Step using selectivizr 使用selectivizr的分步指南
1-downloading selectivizr 1下载selectivizr
2-insert below code in the header. 将以下代码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-Now you can use css3 3-现在可以使用css3
Compatibility Ie 6 ,7,8 兼容性即6、7、8
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.