为什么Firefox在调整图像大小方面如此糟糕？
左边是原始PNG，右边是使用<img width和height缩小到原始大小一半的版本。 请参阅[链接删除]。
为什么在Firefox中resize的图像看起来很模糊。 有没有什么我可以做的，而不需要改变图像文件。 如果图像包含大量的math或文本，模糊特别讨厌。
Bugzilla中存在一个与Firefox图像缩小相关的长期漏洞许可证。 您可能希望密切关注票据，以便跟踪最终的解决scheme，或者如果您觉得可以，请自行提供补丁。
最好的解决方法是使用transform CSS属性来应用一个微小的旋转问题图像和强制子像素渲染，详细Ryan Wheale的答案 。
我知道这是迟到了，但你可以通过应用一个很轻微的旋转来让Firefox更好地渲染图像。 我试图translate()图像获得相同的效果…无济于事。
CSS
.image-scale-hack { transform: rotate( .0001deg ); }
使用Javascript
if( "MozAppearance" in document.documentElement.style ) { $('.logo img').addClass('image-scale-hack'); }
我不惜一切代价避免浏览器嗅探。 我从yepnope.js借来了这个嗅觉，我对此并不感到厌烦。
同样值得注意的是，这个相同的技巧可以用来在webkit和firefox中强制执行子像素图像渲染。 这对于非常慢的animation非常有用 – 最好通过示例来解释：
从Firefox链接的图像呈现文档 通过css或内联样式缩放来模糊图像 ，Su'引用的应用程序包括使用image-rendering:optimizeQuality （更正了我在FF4testing中的问题） – 示例：
我想你的答案是从上面的链接https://developer.mozilla.org/En/CSS/Image-rendering ：'目前自动和optimizeQuality默认是相等的，都导致双线性重采样。 '默认值IE8 +：bicubic（高品质）'
下一个请看： http : //www.codinghorror.com/blog/2007/07/better-image-resizing.html “当使图像变小时，使用双三次，这具有自然的锐化效果。 在丢弃原始图像中的所有额外细节之后，您要强调保留在新的较小图像中的数据。
我可以想到一些可能的解决方法，但都不是很简单：
- 调整服务器上的图像大小。 或者以一半尺寸提供服务，并允许Firefox将其扩展到全部（这大概是可以的），或者针对不同大小的图像具有不同的URL。
- 您可以使用插件在浏览器中完成这项工作（但是我发现的例子实际上并没有实现您需要的function，所以我已经将其删除了）。
TL; DR：图像缩放不太可能被固定。 在任何地方。
更长的版本：
Eris Brasseur有一个页面，可以很好地处理更广泛的问题“为什么只是关于任何图像缩放软件如此糟糕？
http://www.4p8.com/eric.brasseur/gamma.html
由于W3C在这个问题上的立场大致是在各处都有一个不正确的但同样不正确的实现，所以他们回避任何正确处理Gamma（这会使事情稍微复杂一些）。 因此，任何习惯于networking标准的人都可能会继续忽略Gamma，导致Eric和这个主题中描述的效果。 这可以确保即使是缩小比例也不是很明确，正如杰夫·阿特伍德（Jeff Atwood）在另一篇文章中提到的那样。
在这样的环境下，像Lanczos这样的方法茁壮成长，声名远扬，即使执行得不正确，他们的performance也相当好。
换句话说，浏览器就相当于麦当劳汉堡的软件，这个事实将会持续下去。 其影响不需要，但是可能性是倾斜的。
现在（2017年）这个bug在两年前就已经closures了。 简短的testing：
FF，50％：
FF，25％：
解决此问题的方法是将原始图像的大小调整为所需的大小，然后按原样使用图像，而不是在样式表中定义宽度和高度。
