【问题标题】:Background image is not position well in IE 8背景图像在 IE 8 中的位置不佳
【发布时间】:2013-01-25 10:34:57
【问题描述】:
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 文件。但是,它仍然无法正常工作?像这样放置代码是否正确?这似乎很奇怪,因为有一个 ;最后和一个 " after ='scale') 。谢谢

【问题讨论】:

  • 你确定 IE8 理解所有这些 css 规则吗? background-position 似乎不受支持。我还没有遇到这个问题,所以我不能提出解决方法,但可能有一些问题。
  • 我明白了。似乎不支持背景大小和背景位置......我应该怎么做。用img替换背景?
  • 如果图像在您的控制之下,您可以修改它们并避免使用background-size 调整它们的大小。此外 -ms-filter (或过滤器)与其他 css 规则位于相同的位置,即 DIV {-ms-filter: "progid:DXImageTransform.blah(args)";}

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


【解决方案1】:

"background-size" 不适用于 IE8。

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

【讨论】:

  • 有什么解决方法,或者我应该使用 img 而不是背景 url?谢谢
  • 感谢打样,img还是没有按预期显示,应该是背景大小的问题
【解决方案2】:

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


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

【讨论】:

  • 感谢您提出的解决方案,请查看我编辑的问题。提供的代码似乎不起作用
  • 你试过背景:#fff url("../img/custom_icons/facebook.png") no-repeat center center fixed\0/;
猜你喜欢
  • 2012-12-29
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-07-15
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多