-1

我正在使用这个class和这个id(例如)在一个 div 上添加图片:

.icones { 
    background: transparent url('../contents/homepage/60/icones.png') no-repeat;
    display: inline-block;
    width: 50px;
    height: 48px;
    background-size: 60px;
}
#contact {
    background-position: 0px -60px;
}

使用Chrome,一切正常,一切看起来都很好,所有属性都显示在 中element inspector,但是在 中IE,出现了问题。

在使用开发人员工具检查页面时IE,我看到“ background-size”没有出现。

我知道正是这个问题给我带来了麻烦,因为当我隐藏它时,chrome我的页面与IE.

所以我的问题是:我怎样才能强制IE应用这个background-size

谢谢!

编辑 :

因此,即使使用过滤器,它似乎也不起作用:

    .icones { 
        background: transparent url('../contents/homepage/60/icones.png') no-repeat;
        display: inline-block;
        width: 50px;
        height: 48px;
        background-size: 60px;

        filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../contents/homepage/60/icones.png',sizingMethod='scale');
        -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../contents/homepage/60/icones.png',sizingMethod='scale')";
}
#contact {
    background-position: 0px -60px;
}

解决方案 :

手动编辑图片大小并忘记背景大小。一切都好!

4

1 回答 1

0

对于 IE,您必须使用特定的 CSS 过滤器:

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

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

或者使用 jquery 来实现效果,就像在这个链接中解释的那样。

于 2013-07-31T14:07:39.387 回答