Firefox中的字体平滑

Question

使用Google WebFonts (在本例中为“Oswald”)，我发现我的字体比应有的更加粗体。我已经在基于webkit的浏览器中解决了这个问题，使用：

-webkit-font-smoothing: antialiased;

但在Firefox中，我找不到控制这一点的声明。我听说过使用text-shadow hack来解决这个问题，但我不喜欢使用它，因为它无疑会改变字体的几何属性。

这是它在webkit (Chrome)中的样子：

​

​

多亏了Firefox，这才是块状的可怕的渲染：

​

​

我知道在FireFox中有一种方法可以做到这一点，因为我在font -Composator.com上找到了这个字体，并且它可以在使用Firefox的font-combinator上正确呈现。这是它在Firefox上通过font-composator.com的样子：

​

​

浏览用于创建font-combinator的css之后，我发现了这个声明：text-rendering: optimizelegibility;，但这在应用于我的元素时不起作用。

我也尝试过：

text-rendering: optimizeLegibility;
text-rendering: geometricPrecision;
font-smooth: always;
font-smooth: never;
font-smoothing: antialiased;
-moz-font-smoothing: antialiased;

如何让Firefox消除我的字体的锯齿，使它们在显示时看起来正确？你能找到使它们在www.font-Composator.com上正确显示的声明或声明的组合吗？

我使用的是一个相对较旧的FireFox版本(16.0.2)，因为这台机器安装了一个旧版本的OSX。

Answer 1

这只是OSX上的Firefox问题...

我刚刚回答了这个问题:从你的问题中找出可能的解决方案的How to antialias SVG text in Firefox。

我认为您可以使用以下属性：

-moz-osx-font-smoothing: grayscale;

这将与Firefox25一起发布(每晚的构建可以在http://nightly.mozilla.org/上找到)

Answer 2

你有没有试过声明一个数字字体粗细，而不仅仅是‘正常’或‘粗体’？在不同的浏览器中呈现网页字体有很多不同之处。

尝试将{font-weight: 400;}设置为普通文本，将{font-weight: 700;}设置为粗体。