CSS 背景大小 :cover getting blurry and dull in Chrome

Question

我经常有这种感觉，设置为 background-size:cover(在 div 上)的图像在 Google Chrome 中看起来不清晰锐利。

这是我使用的 CSS。

.slide {
    width:1280px;
    height:400px;
    background-image:url(background.jpg);
    -webkit-background-size: cover!important;
    -moz-background-size: cover!important;
    -o-background-size: cover!important;
    background-size: cover!important;
    background-position:center center;
    background-repeat:no-repeat;    
}

在此处查看实时示例:http://www.wovenplus.com/test/

只需在 Chrome 和 IE 中比较上面的链接。在我的例子中，在 Chrome 中，图像看起来模糊而暗淡，而在 IE 中，它看起来清晰锐利。 (仔细观察靠垫的叶子或顶部，或在 Chrome 和 IE 窗口之间切换以查看差异)。

有人也注意到了吗？有什么解决办法吗？

Answer 1

尝试将此添加到代码中: 图像渲染:-webkit-optimize-contrast; 对我来说，它完美地完成了任务。