Pixelperfect 放大的 Sprite 背景图像在 IE 中仍然显示为平滑/双三次图像?
不知何故,下面放大的精灵图像在 Internet Explorer 9 中并未显示为清晰的最近邻像素完美。在 FF 中,完美的像素完美/清晰。
然而在 IE 中,它似乎变得双三次平滑,在这种情况下我不想要这种情况。知道这个 css 有什么问题吗?
.iconbig{ /* upscale the icons sprite images 200% and show them pixelperfect */
background-image:url(icons.gif);
background-repeat:no-repeat;
height:200%;
background-size: 26px auto;
-moz-background-size: 26px;
image-rendering:-moz-crisp-edges;
-ms-interpolation-mode:nearest-neighbor; /* <<== seems not working !!! */
}
somehow, the upscaled sprite image below doesnt show up as a crisp nearest-beighbour pixelperfect in Internet Explorer 9. In FF works perfectly pixelperfect/crisp.
in IE however, it seems to get bicubic smooth, which I dont want in this case. Any idea what is wrong with this css?
.iconbig{ /* upscale the icons sprite images 200% and show them pixelperfect */
background-image:url(icons.gif);
background-repeat:no-repeat;
height:200%;
background-size: 26px auto;
-moz-background-size: 26px;
image-rendering:-moz-crisp-edges;
-ms-interpolation-mode:nearest-neighbor; /* <<== seems not working !!! */
}
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
-ms-interpolation-mode
已从 IE9 中删除。显然,微软认为我们只需要 -ms-interpolation-mode:bicubic 并且由于 IE9 总是使用双三次缩放,他们认为该属性已过时并删除了它。-ms-interpolation-mode
was removed from IE9. Apparently Microsoft thinks that we only needed it for-ms-interpolation-mode:bicubic
and that since IE9 always uses the bi-cubicscaling they thought that the property is obsolete and removed it.我敢打赌 -ms-interpolation-mode:nearest-neighbor 仅适用于 html IMG 标签,不适用于背景图像。由于 MS 属性仅适用于拉伸图像。对于解决方案,我只能考虑为 IE 加载一个替代的 css 背景图像,在最近的邻居中以图形方式缩放文件(也许您可以使用 png-8,减少颜色,以节省内存。尽管 png 压缩已经会压缩大面积相同颜色)模式在某些 2D 软件中完成。
I'd bet -ms-interpolation-mode:nearest-neighbor only applies to html IMG tag, not to background images. As the MS property only works on stretched images. For a solution I can only think on loading just for IE an alternative css background image, graphically scaled file in nearest neigbor (maybe it is possible for you to use png-8, reducing colors, to save memory. Although png compression already will compress large areas of same color) mode done inside some 2D software.