使 Firefox 图像缩小类似于 Chrome 或 IE 中的结果 [英] Make Firefox image scaling down similar to the results in Chrome or IE

问题描述

左侧是原始 PNG，右侧是使用 width 和 height 缩小到原始大小大约一半的版本.

On the left is the original PNG and on the right are versions reduced to roughly half the original size using width and height.

为什么调整后的图像在 Firefox 中看起来如此模糊?我可以在不更改图像文件的情况下做些什么吗?如果图像包含大量数学或文本，模糊性尤其令人讨厌.

Why does the resized image look so fuzzy in Firefox? Is there anything I can do about it without changing the image file? The fuzziness is particular annoying if the image contains large amounts of math or text.

推荐答案

有一个 在 Bugzilla 中提交的与 Firefox 图像缩小相关的长期错误票.您可能希望密切关注故障单以跟踪其最终解决方案，或者如果您愿意，可以自己贡献一个补丁.

There is a longstanding bug ticket filed in Bugzilla related to Firefox image downscaling. You might like to keep an eye on the ticket to track its eventual resolution or contribute a patch yourself if you feel able to.

最好的解决方法是使用 transform CSS 属性对有问题的图像应用微小的旋转并强制子像素渲染，如 Ryan Wheale 的回答.

The best workaround is to use the transform CSS property to apply a tiny rotation to the problem image and force sub-pixel rendering, as detailed in Ryan Wheale's answer.

这篇关于使 Firefox 图像缩小类似于 Chrome 或 IE 中的结果的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！