0

由于某些奇怪的原因，背景图像未在 IE 中显示。我尝试使用图像的完整路径，仅使用背景而不是背景图像，使用 png、gif、jpg，在图像路径周围使用引号和双引号。基本上尝试了网上关于 IE 中背景图像的所有建议

html, body {
margin: 0;
padding: 0;
width: 1008px;
margin: 0 auto; 
font-family:"Trebuchet MS";
font-size:14px;
line-height: 190%;
text-align:left;
text-decoration: italic;
background-image: url(../images/bgr_top.jpg), url(../images/bgr_bottom.jpg);
background-repeat: repeat-x, repeat-x;
background-position:center top, center bottom;
}

我唯一的怀疑是我使用了两张图片，一张用于顶部，一张用于页面底部。还阅读了右括号后的空格，但不确定它是否相关，因为我正在使用 background-repeat: 在不同的行上。

非常欢迎任何其他建议:)

4

3 回答 3

2 
background-image: url(../images/bgr_top.jpg), url(../images/bgr_bottom.jpg);

只能在支持 css3 的浏览器中工作，因此只有 IE 9+

支持所有浏览器的最佳方式是为每个背景使用单独的实体。

于 2013-09-15T06:34:29.013 回答
0

他们在不同的浏览器上工作吗？我会首先检查网址是否正确以及图像是否存在，打开开发者工具并查看浏览器是否下载它们，也只需要使用一张图像，看看你是否能看到，IE 9 也不支持css 3 它可能导致图像不显示

于 2013-09-15T06:35:15.210 回答
0

只是想让你知道我是如何解决我的问题的。我添加了包含整个网站的附加 div，然后我将顶部图像添加到 html 中，将底部图像添加到 css 中的正文中。

html {
    background: url("../images/bgr_top.jpg");background-repeat: repeat-x; background-position:center top;
    height: 100%;
}

body{
background: url("../images/bgr_bottom.jpg"); background-repeat: repeat-x; background-position:center bottom;

    margin: 0;
    padding: 0;
    margin: 0 auto; 
    font-family:"Trebuchet MS";
    font-size:14px;
    line-height: 190%;
    text-align:left;
     text-decoration: italic;

}

.main {
    margin: 0;
    padding: 0;
    width: 1008px;
    margin: 0 auto; 
    font-family:"Trebuchet MS";
    font-size:14px;
    line-height: 190%;
    text-align:left;
     text-decoration: italic;

}

结果 我现在在所有浏览器中都有两个背景，包括 IE7、8 等

希望这可以帮助某人。

于 2013-09-15T13:54:11.253 回答