在Mozilla

时间:2018-05-30 18:00:19

标签: css css3 firefox browser font-face

字体平滑在Mozilla中不起作用(版本60.0.1(64位))。我在CSS中添加了代码

body,html{
margin: 0;
padding: 0;
height: 100%;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

我在Mozila得到Invalid property value

enter image description here

它正在Chrome中显示

enter image description here

知道它为什么不起作用? 你能帮我解决这个问题吗? 提前致谢

1 个答案:

答案 0 :(得分:0)

最可能的情况是您使用的是非Mac OS X / macOS操作系统来运行Firefox。

MDN web docs entry on font-smooth指定:

  

Firefox实现了类似的属性,但具有不同的值:-moz-osx-font-smoothing。它仅适用于Mac OS X / macOS。

据我所知,在大多数网络浏览器中默认启用子像素渲染,而不是抗锯齿字体。 This Usability Post article解释了为什么它仍然是Mac OS X / macOS浏览器中的启用功能:

  

子像素渲染为您在浅色背景上的典型黑暗文本提供了最佳的字体清晰度。但是,在Mac OS X上,如果将其反转并在深色背景上设置浅色文本,则会产生相当难看的效果,即文本变得过于粗糙,溢出其线条。在深色背景上从浅子像素渲染转换为抗锯齿,使其看起来更轻,从而抵消了粗体效应。

编辑:另请注意,-moz-osx-font-smoothing: grayscale;属性仅适用于Mac OS X / macOS Firefox 25+。错误报告可以在Bugzilla's Bug 857142找到。