html - 为什么我重复的 PNG 背景图像在 IE7 或 IE8 中不显示？

Question

我正在尝试将 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;
}

Answer 1

查看博文 PNG background-repeat bug in Internet Explorer 7 and 8

它说:

Apparently Internet Explorer 7 and 8 still haven’t gotten PNG quite right. While working on one of my current projects, I stumbled onto a bug with repeating PNG background images.

For this project, I have a page template with several container elements that all have a 1 pixel by 1 pixel PNG background set to repeat, and it looks great when testing it in IE 7 and IE 8. So, I created my next page template with the same styling. This time, IE 7 and 8 both choked when handling the background-repeat. Instead of repeating, both of these browsers inexplicably tried to stretch the 1×1 image across the entire container. The PNG happened to have 60 percent alpha transparency, but I’m not sure that matters. A coworker suggested making it a 10×10 pixel image instead, just to see what happens. Surprise, surprise. That fixed it.

I did a little more searching to see if anyone else had come across this and found this recent blog post. The author also found that this bug appears to occur at random, and that a 4×4 pixel image solved his problem. Since there’s no very little file size difference between 10×10 and 1×1, I’ll stick with the 10×10. But I agree with him that this bug created a cool effect, and it would be great if it could be replicated at will.