CSS的背景图大小“属性 - 跨浏览器解决方案？ [英] CSS 'background-size' property - Cross-Browser Solution?

问题描述

我有一个使用这个CSS的元素：

I have an element that uses this css:

.my-box {
padding-left:50px;
background-image:url('images/img01.png');
background-size:20px;
height:20px;
}

我的问题：像Internet Explorer浏览器中，背景size'属性不起作用。有没有任何一种解决方案通过JavaScript和jQuery或CSS来完成这项工作，而不必把物理＆LT; IMG＆GT;在标记的标签？

My problem: in browsers like Internet Explorer, the 'background-size' property doesn't work. Is there a solution either through JavaScript, jQuery or CSS to make this work without having to put a physical <img> tag in the markup?

推荐答案

您可以使用此填充工具。也许填写您的问题。背景大小的一个IE浏览器的行为将支持：盖;和背景-SIZE：包含;到IE8。

You can use this polyfill. Maybe fill your issue. An IE behavior adding support for background-size: cover; and background-size: contain; to IE8.

如何使用它？

无论你使用的背景大小：盖;或背景-SIZE：包含;在你的CSS，添加到该文件的引用。 backgroundsize.min.htc

Everywhere you use background-size: cover; or background-size: contain; in your CSS, add a reference to this file. backgroundsize.min.htc

.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);
}

在这里看到：背景大小的填充工具GitHub的回购和进一步的信息

这篇关于CSS的背景图大小“属性 - 跨浏览器解决方案？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！