所以今天早上我有一个自动更新到IE 11,检查我的眼睛后,似乎我的一些背景图像是模糊的.
我不得不检查,这不是我的形象导致问题,所以在启动Chrome后,他们是好的和清脆的再次…
我完全迷惑不解
我现在卸载IE11更新,他们再次漂亮,清脆的IE10 …有没有人遇到这个?
我已经在一个屏幕截图中显示了不同浏览器中的图像.
这里是一个jsfiddle的链接,我没有IE11不再测试,但它与我使用的相同的标记和CSS:http://jsfiddle.net/3g52E/
解决方法
那我可以看看是什么导致这个问题.这是你的._ui的边界半径.
现在我不能告诉你为什么会发生这种情况.但是,如果你想修复这个问题,你可以使用或不使用border-radius,这是一个更好的解决方案,我认为,使用< img>标签生成背景.
使用图像元素
<img src="http://i.imgur.com/DauuVHW.png" />
现在截断你的形象,你可以使用位置:relative; position:absolute;和一个overflow:hidden ;:
.block1 > div { position: relative; overflow: hidden; }
哪些基本图像属性是:
img { position: absolute; left: 2px; }
现在您可以使用顶部和底部的偏移量进行图像定位.在以前使用背景位置的地方:
._bre._ui img { top: -68px; } ._com._ui img { top: -24px; }
这样,您的图像不再具有border-radius的元素的一部分,这导致了这个问题.他们现在有更明确的分离; 2个不同的元素.