背景大小：最初在IE10不工作，下

您好我有以下CSS类和DOM元素背景大小：最初在IE10不工作，下

<button [ngClass]="{ 'filter-icon-open': open, 'filter-icon-close': !open }"> 
</button>

CSS

.open-filter { 
    cursor: pointer; 
    float: right; 
    button { 
     width: 40px; 
     height: 40px; 
     background-repeat: no-repeat; 
     background-position: center; 
     background-size: initial; 
    } 
    button:hover { 
     background-image: url("./../../../../assets/images/ico_filter_over.png"); 
     background-color: $dbsred; 
     border: none; 
    } 
    button:focus { 
     outline:none; 
    } 
} 

.filter-icon-open { 
    background-image: url("./../../../../assets/images/ico_filter_over.png"); 
    background-color: red; 
} 

.filter-icon-close { 
    background-image: url("./../../../../assets/images/ico_filter.png"); 
    border: solid #B3B3B3 1px; 
}

它的工作完美铬。但对于IE来说，这个图标很大。如何解决这个问题。新手到CSS。有人可以帮忙。提前致谢。

尝试：

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

，但我认为这部分铬被注释掉和它没有工作过。

来源

2017-09-06 blackdaemon

问题出在'filter-icon-close'。图像比另一个更大 – blackdaemon

哪个IE版本还是你的意思是边缘？ background-size在IE10及以下版本中不受支持。 – Zze

是啊，它不支持。那就是问题 – blackdaemon

如果问题是，打开和关闭图像的大小不同，您可以使用CSS来调整图像的浏览器：

.filter-icon-open { 
    background-image: url("./../../../../assets/images/ico_filter_over.png"); 
    background-color: red; 
    height : 100px; 
    width : 100px; 
} 

.filter-icon-close { 
    background-image: url("./../../../../assets/images/ico_filter.png"); 
    border: solid #B3B3B3 1px; 
    height : 100px; 
    width : 100px; 
}

这将迫使双方的开启和关闭图像是相同的但是，我个人建议不要这种方法，因为它可能会导致图像偏斜或像素化。

更好的解决方案是使用您选择的图像编辑工具（如Photoshop）调整图像大小。

来源

2017-09-06 02:59:56 JeffryHouser

我有高度和宽度设置在按钮。所以这个高度和宽度不会变得有效。 – blackdaemon

initial在IE上不受支持。对于IE为背景尺寸按照documentation允许值是：

background-size: [ <length> | <percentage> | auto ] {1,2} | cover | contain [ , [ <length> | <percentage> | auto ] {1,2} | cover | contain ]*

此外，initial只是将该属性设置为属性的默认值和background-size的默认值是auto。所以你可以直接使用它或者使用上面的任何值。

来源

2017-09-06 06:10:49

背景大小：最初在IE10不工作，下

回答

相关问题