Chrome Mac不能很好地渲染非常小的PNG

Question

我从Photoshop CS6导出了PNG-24，它在Chrome中看起来像这样。

您可以注意到三角形周围的白色笔触。

相同的PNG在其他浏览器中正确呈现。 在Firefox中渲染是这样的。

Answer 1

我遇到了同样的问题。似乎在对比度非常小的时候，Chrome会尝试“解决问题”。

咬牙切齿之后，我发现添加了：

    image-rendering: -webkit-optimize-contrast; /* Chrome (and Safari) */

问题元素的CSS解决了问题。

此外，请参阅此帖子：https://superuser.com/questions/530317/how-to-prevent-chrome-from-blurring-small-images-when-zoomed-in处理类似问题。