在Chrome和Firefox中匹配“Helvetica Neue”

我目前在我正在开发的网站上使用Helvetica Neue。在过去几个月中，我注意到Google Chrome中的Helvetica Neue字体呈现出非常大胆。在Firefox中查看同一网站时，一切看起来都好多了，并且和预期的一样。在Chrome和Firefox中匹配“Helvetica Neue”

下面是参考的对比截图：

enter image description here

这部分的CSS规则相当简单：

#top-bar { 
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; 
    height: 30px; 
    color: #ccc; 
    font-size: 80%; 
    line-height: 30px; 
} 

#top-bar a { 
    color: #eee; 
}

任何人都可以解释为什么字体看起来在这两个浏览器，因此不同？即使font-weight: normal没有任何作用，它几乎看起来像Chrome正在渲染较重的字体重量。这个网站也不是唯一的。任何使用Helvetica Neue的站点（包括Bootstrap Docs）都会在我的PC上（以及其他运行Chrome的用户）遭受这种情况。在Mac上一切都很好。

有没有解决方案？例如，在Chrome中模仿FF的字体渲染技术？

来源

2013-10-17 BenM

无论浏览器如何，Helvetica Neue在Windows上渲染都很差。 – BoltClock

我知道，但它并不能解释为什么它在Windows上呈现更好的FF。我想问的是如何在Chrome中匹配FF的渲染。 – BenM

Helvetica Neue不适用于大多数电脑。如果你通过@ font-face来提供它，你应该描述这个并确定字体和字体文件的来源。 –

这是因为Firefox支持硬件加速的DirectWrite API（Direct2D的一部分）来呈现字体，而Chrome则不支持。例如见：

即使你在Firefox中关闭硬件加速，因为这两种浏览器都使用不同的字体渲染后端的结果是不同的。

来源

2013-10-17 10:24:23 nwellnhof

感谢您的输入！我想这是一个坐等问题。 – BenM

在Chrome和Firefox中匹配“Helvetica Neue”

回答

相关问题