在IE 8中,背景图像位置不佳

时间:2013-01-25 02:15:30

标签: html css internet-explorer internet-explorer-8

nav li a.home                   { background:url('../img/custom_icons/home.png') no-repeat center; background-size: 30px 30px; background-position: 0px -1px;}

nav li a.contact                { background:url('../img/custom_icons/email.png') no-repeat center; background-size: 32px 35px; background-position: 0px -1px; }

nav li a.show_all               { background:url('../img/custom_icons/slide.png') no-repeat center; background-size: 35px 50px; background-position: -5px -10px; }

#facebook {
    background: url(../img/custom_icons/facebook.png) no-repeat;
    background-size:30px 30px;
}

#sina {
    background: url(../img/custom_icons/sina.png) no-repeat;
    background-size:30px 30px;
}

我发现chrome / fx或其他浏览器中的那些背景图像是完美定位的,但不是在IE 8中,它太小/太大或只是移动到其他地方。如何解决问题并且工作方式相同像其他浏览器?感谢

更新:添加ms过滤器后,仍无效?

nav li a.home                   { background:url('../img/custom_icons/home.png') no-repeat center; background-size: 30px 30px; background-position: 0px -1px;}

filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
src='../img/custom_icons/home.png',
sizingMethod='scale');

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

添加建议的过滤器后,这是css文件。但是,它仍然无法正常工作?这样放置代码是否正确?看起来很奇怪,因为有一个;在结束时和“后='比例')。谢谢

2 个答案:

答案 0 :(得分:2)

"背景大小"不适用于IE8。

http://caniuse.com/#feat=background-img-opts

答案 1 :(得分:1)

这里的答案https://stackoverflow.com/a/6353808/358906可能比我原来的答案更好。


在IE8中,确保浏览器模式设置为IE8标准,如果不是,请更改它并查看它是否解决了您的问题。如果它解决了问题,那么你需要让IE8始终使用元标记或服务器头来使用I8标准模式。

<强> IE8 Developer Tools