Firefox中的字体平滑

Question

使用Google WebFonts(在本例中为"Oswald"),我发现我的字体比它们应该更大胆.我使用以下方法在基于webkit的浏览器中解决了这个问题

-webkit-font-smoothing: antialiased;

但在Firefox中我找不到控制它的声明.我听说使用text-shadow黑客来解决这个问题,但我不想使用它,因为它无疑会改变字体的几何属性.

以下是webkit(Chrome)中的内容:

这是由于Firefox的块状可怕渲染:

我知道有一种方法可以在FireFox中实现这一点,因为我在font-combinator.com上找到了这个字体,并且它使用Firefox在font-combinator上正确呈现.以下是通过font-combinator.com在Firefox上看起来的样子:

在浏览用于创建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-combinator.com上正确显示的声明或声明组合吗？

我使用的是相对旧版本的FireFox(16.0.2),因为这台机器安装了旧版本的OSX.

Answer 1

这只是一个关于OSX问题的Firefox ...

我刚刚回答了这个问题:如何在Firefox中使用可能的解决方案来解决SVG文本问题.

我认为你可以使用以下属性:

-moz-osx-font-smoothing: grayscale;

这将与firefox 25一起发布(夜间版本可以在http://nightly.mozilla.org/找到)

Answer 2

您是否尝试过声明数字字体粗细而不仅仅是“正常”或“粗体”？不同浏览器中网页字体的呈现存在很大差异。

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