Question

我的HTML代码

<div id="content_main"></div>

CSS

        #content_main
{
    width:1024px;
    height:150px;
    background:url('../images/Orange.jpg');
    background-repeat:no-repeat;
    background-size:1024px 150px;
    -moz-background-size: 1024px 150px;
    -o-background-size: 1024px 150px;
}

后台大小在IE8中不起作用，如何解决这个问题，我什么都不知道，请帮助我。

Answer 1

IE8不支持背景图像选项。您可以使用caniuse.com网站查看各种HTML5功能的浏览器支持矩阵，例如background-size。或者，如果需要IE8支持，则需要使用<img>

后面的<div id="content_main">标记集

按照@ ahsan的建议查看this other similar question，其中包含一些填充建议和ms-filter在IE8中background-size的解决方法

Answer 2

请查看有关背景属性的参考资料： http://www.jacklmoore.com/notes/ie-transparency-problems

Answer 3

#content_main{

width:1024px;
height:150px;
background:url('../images/Orange.jpg');
background-repeat:no-repeat;
background-size:1024px 150px;
-moz-background-size: 1024px 150px;
-o-background-size: 1024px 150px;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader( src='images/Orange.jpg', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader( src='images/Orange.jpg', sizingMethod='scale')";

}

Answer 4

在IE8中使用CSS3 background-size: cover;和background-size: contain;拉伸背景图片。

如何使用它？

将backgroundsize.min.htc上传到您的网站，以及将发送IE所需的mime类型的.htaccess（仅限Apache - 它内置于nginx，节点和IIS）。

在CSS中使用background-size的任何地方，添加对此文件的引用。

.selector { 
    background-size: cover;
    /* The url is relative to the document, not to the css file! */
    /* Prefer absolute urls to avoid confusion. */
    -ms-behavior: url(/backgroundsize.min.htc);
}

以这种方式设置的元素应该有position: relative;或position: fixed;以及z-index.如果没有，则会给他们position: relative;和z-index: 0;。< / p>

IE 8中的背景图像大小不起作用

4 个答案: