在IE中拉伸背景图片

问题描述

我有背景图片.我正在拉伸它以使其适合整个页面.但是它可以在IE以外的浏览器中使用，但是如果我使用background-size，则可以在IE9中使用.但我希望它能在IE8中工作.这该怎么做?预先感谢.

I have a background image. I am stretching it so that it fits the entire page.But it is working in browsers other than IE.But if I use background-size, it is working in IE9. But I want it to work in IE8. How to do this? Thanks in advance.

在其他浏览器和IE9中:

In other browsers and in IE9:

在IE8中:

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

You can find the difference at the bottom of the page.Here is my code:

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;

}

推荐答案

IE8不支持background-size属性.

您有以下选择:

• 使用不需要拉伸的背景图形.

• Use a background graphic that doesn't need stretching.

为IE8提供不同的背景图片(或完全没有背景图片)
[edit] 请参见我在该主题上的博客文章，以获取有关如何在不使用浏览器的情况下使用纯CSS实现此目的的更多信息.

Provide IE8 with a different background image (or no background image at all)
[edit] See my blog post on the subject for more info on how to achieve this in pure CSS with no browser hacks.

忽略该问题，让IE8用户看到一个稍微破损的网站.

Ignore the problem and let IE8 users see a slightly broken site.

使用CSS3Pie这样的polyfill脚本将background-size功能添加到IE8.

Use a polyfill script like CSS3Pie to add the background-size feature to IE8.

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

If you really want to use background-size, and you really need to support IE8, then the last of those options is probably the best one for you.

这篇关于在IE中拉伸背景图片的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！