Question

是否有任何已知的方法可以使CSS样式background-size在IE中运行？

Answer 1

有点晚了，但这也很有用。有一个IE过滤器，适用于IE 5.5+，您可以申请：

filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
src='images/logo.gif',
sizingMethod='scale');

-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(
src='images/logo.gif',
sizingMethod='scale')";

但是，这会缩放整个图像以适应分配的区域，因此如果您使用精灵，这可能会导致问题。

规格：AlphaImageLoader Filter @microsoft

Answer 2

我创建了jquery.backgroundSize.js：一个1.5K jquery插件，可以用作“封面”和“包含”值的IE8后备。看看demo。

Answer 3

感谢这篇文章，我对跨浏览器快乐的全面了解是：

<style>
    .backgroundpic {
        background-image: url('img/home.jpg');
        background-size: cover;
        filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
        src='img/home.jpg',
        sizingMethod='scale');
    }
</style>

我已经处理了这段代码已经很久了，但我想添加更多的浏览器兼容性，我已将此附加到我的CSS以获得更多浏览器兼容性：

-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;

Answer 4

甚至更晚，但这也很有用。有一个jQuery-backstretch-plugin，你可以用作背景大小的polyfill：cover。我想用jQuery抓取css-background-url属性并将其提供给jQuery-backstretch插件一定是可能的（并且相当简单）。好的做法是使用modernizr测试背景大小支持，并使用此插件作为后备。

在SO here上提到了backstretch-plugin.jQuery-backstretch-plugin-site是here。

以类似的方式，您可以创建一个jQuery插件或脚本，使背景大小适合您的情况（背景大小：100％）和IE8-。所以回答你的问题：是的，有一种方法，但是没有即插即用的解决方案（即你必须自己做一些编码）。

（免责声明：我没有彻底检查backstretch-plugin，但它似乎和background-size一样：封面）

Answer 5

有一个很好的polyfill：louisremi/background-size-polyfill

引用文档：

将backgroundsize.min.htc上传到您的网站，以及   .htaccess将发送IE所需的mime类型（仅限Apache） -   它是在nginx，node和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);
}

Answer 6

在IE11中，Windows 7对我有用，

background-size: 100% 100%;

Answer 7

您可以使用此文件 IE8的https://github.com/louisremi/background-size-polyfill“background-size polyfill”）非常简单易用：

.selector {
background-size: cover;
-ms-behavior: url(/backgroundsize.min.htc);
}

Answer 8

我尝试使用以下脚本 -

.selector { 
background-image: url("img/image.jpg");
background-size: 100%;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-repeat: no-repeat;
}

它对我有用！

如何在IE中制作背景大小的工作？

8 个答案: