1

我正在尝试将 PSD 转换为 HTML,但遇到了问题。我的网站可以在除 IE8 和 IE7 之外的所有主流浏览器中运行。IE8 和 IE7 不显示背景。

背景是PNG图像,并且重复。我知道非重复图像的方式,但对于重复图像我需要做什么?这是我使用的 CSS:

#footer-top {
    padding: 20px 0;
    background: url('img/footer-bg.png')repeat;
    width:100%;
    overflow:hidden;
    margin-top: 38px;
}
4

3 回答 3

2

请参阅Internet Explorer 7 和 8 中的博文PNG 背景重复错误

它说:

显然 Internet Explorer 7 和 8 还没有完全正确地获得 PNG。在处理我当前的一个项目时,我偶然发现了一个重复 PNG 背景图像的错误。

对于这个项目,我有一个包含多个容器元素的页面模板,这些元素都有一个 1 像素 x 1 像素的 PNG 背景设置为重复,并且在 IE 7 和 IE 8 中测试它时看起来很棒。所以,我创建了我的下一个页面模板具有相同的样式。这一次,IE 7 和 8 在处理后台重复时都卡住了。这两个浏览器都没有重复,而是莫名其妙地试图在整个容器中拉伸 1×1 图像。PNG 恰好有 60% 的 alpha 透明度,但我不确定这是否重要。一位同事建议将其改为 10×10 像素的图像,只是为了看看会发生什么。惊喜,惊喜。那解决了它。

我做了更多的搜索,看看是否有其他人遇到过这个并找到了这篇最近的博客文章。作者还发现这个 bug 似乎是随机出现的,一张 4×4 像素的图像解决了他的问题。由于 10×10 和 1×1 之间的文件大小差异不大,我将坚持使用 10×10。但我同意他的观点,这个bug创造了一个很酷的效果,如果可以随意复制就很棒了。

于 2013-08-21T09:38:50.907 回答
1

也许你以前需要一个空间repeat

background: url('img/footer-bg.png') repeat;

(我没有方便的 IE7 或 8 来检查这个。)

于 2013-08-21T09:55:43.930 回答
-1

亲爱的,我找到了最简单的方法。去尝试一下

background-image:url(images/back-bg.jpg) !important;
background-repeat:repeat !important;
background-color:#fff !important;
background-position:left !important;
于 2013-08-21T10:20:37.573 回答