使用 Google WebFonts(在本例中为“Oswald”)，我发现我的字体渲染得比应有的更粗。我已经在基于 webkit 的浏览器中使用以下方法解决了这个问题:
-webkit-font-smoothing: antialiased;
但在 Firefox 中我找不到控制它的声明。我听说过使用 text-shadow hack 来解决这个问题，但我不想使用它，因为它无疑会改变字体的几何属性。
这是它在 webkit (Chrome) 中的样子:
感谢 Firefox，这是可怕的 block 状渲染:
我知道有一种方法可以在 FireFox 中实现这一点，因为我在 font-combinator.com 上找到了这种字体，并且它可以在使用 Firefox 的 font-combinator 上正确呈现。这是通过 font-combinator.com 在 Firefox 上的样子:
在浏览了用于创建字体组合器的 css 之后，我发现了这个声明:text-rendering: optimylegibility;，但是当应用于我的元素时这不起作用。
我也试过:
text-rendering: optimizeLegibility;
text-rendering: geometricPrecision;
font-smooth: always;
font-smooth: never;
font-smoothing: antialiased;
-moz-font-smoothing: antialiased;
如何让 Firefox 对我的字体进行抗锯齿处理，以便它们在显示时看起来正确？您能否在 www.font-combinator.com 上找到使它们正确显示的声明或声明组合？
我使用的是相对较旧版本的 FireFox (16.0.2)，因为这台机器安装了旧版本的 OSX。
最佳答案
这只是 OSX 上的 Firefox 问题...
我刚刚回答了这个问题:How to antialias SVG text in Firefox为您的问题提供可能的解决方案。
我认为您可以使用以下属性:
-moz-osx-font-smoothing: grayscale;
这将与 firefox 25 一起发布(每晚构建可以在 http://nightly.mozilla.org/ 找到)
关于css - Firefox 中的字体平滑，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/15182997/