internet-explorer - 在 IE 中拉伸(stretch)背景图像

Question

我有一张背景图片。我正在拉伸(stretch)它以使其适合整个页面。但它在 IE 以外的浏览器中工作。但是如果我使用背景大小，它在 IE9 中工作。但我希望它在 IE8 中工作。这个怎么做？提前致谢。

在其他浏览器和 IE9 中:

在 IE8 中:

您可以在页面底部找到不同之处。这是我的代码:

body, html{
    height:100%;
    padding:0;
    margin:0;
}

body.BodyBackground {

    margin: 0px;
    background: url(../images/common/header/Background_color.png);
     background-repeat:repeat-x;
    background-attachment:fixed;
    background-position:top center; 
    height: 100%;
    width: 100%;
    border: 0;
    background-size:contain;
    display:inline-block;
    background-color: transparent;


}

div.content{    
    height:100%;
    width:97%;
    background-color: rgb(255, 255, 255);
    margin: 0px 25px 25px 25px;
    height:470px;
    background-position:center;
    background-repeat:no-repeat;
    background-attachment:fixed;

}

Answer 1

IE8 不支持 background-size 属性。

您有以下选择:

• 使用不需要拉伸(stretch)的背景图形。

• 为 IE8 提供不同的背景图像(或根本没有背景图像)
  [编辑] 参见 my blog post on the subject有关如何在没有浏览器 hack 的情况下使用纯 CSS 实现此目的的更多信息。

• 忽略这个问题，让 IE8 用户看到一个稍微损坏的站点。

• 使用 CSS3Pie 等 polyfill 脚本将 background-size 特性添加到 IE8。

如果您真的想使用 background-size，并且您确实需要支持 IE8，那么最后一个选项可能最适合您。