谷歌Chrome字体渲染（大胆和紧张）

Question

我知道现在各种网站上都存在大量与字体呈现相关的问题。其中一个应该给我一个答案，所以你会想。无论我搜索多少，我似乎无法找到解决问题的方法。

在google chrome中，几乎所有字体都以粗体显示。那真的不是世界末日。更让我感到困惑的是，它们变得非常紧张。因为他们看起来有点扭曲。

我拍了一张照片，以显示我的firefox和chrome字体渲染之间的区别：

http://i.stack.imgur.com/hYRh4.png

我只是想摆脱这个。它一直困扰着我一段时间，我在网上找不到任何解决方案。

对于我已卸载并重新安装chrome的记录。此外，我已在Direct Write中停用chrome://flags。

任何帮助？

Answer 1

这实际上不是渲染问题，而是字体加载问题。 Firefox显示Arial（一种针对小尺寸渲染而优化的字体），而Chrome则显示Helvetica（不是，至少是您安装的版本）。

您的屏幕截图中的编辑器可能会要求提供Helvetica字体，如果没有Helvetica，则需要Arial和其他sans-serif字体。我假设您的计算机上只安装了Bold版本的Helvetica。它实际上应该显示常规版本，但它不可用。 因此，Firefox会依赖Arial，而Chrome会显示您最接近的重量：粗体版本。

要解决您的问题，您应该尝试卸载Helvetica Bold（通过控制面板＆gt;字体）。请注意，它也可以通过其他名称，如Helvetica Neue，Helvetica LT Std，Neue Helvetica等。不要忘记重新启动以确保。然后，Chrome还应显示优化的Arial。

Answer 2

尽管问题有点陈旧，但“问题”仍然可能发生，我发现了另一种情况导致这种文本外观的发生（老实说，这使我来到了这里）。

就我而言，我没有注意到我的jQuery回调循环并多次将文本呈现到固定位置，大约20次。我检查了整个CSS。字体系列，文本渲染（在这种情况下为geoometricPrecision），字体粗细以及其他内容。

我花了相当长的时间才发现我彼此之间有20个div，并且文本相同，因为那里有一个非常复杂且深入封装的DOM。

因此，如果您遇到类似问题，也可能需要检查一下。

最简单的检查方法是，使用浏览器集成的检查器/开发人员工具删除包含文本的元素（Windows： F12 ，Mac： ALT + CMD + I ）-导航至“元素”，将左侧图标（其中带有光标符号的图标）切换为蓝色（活动），然后在浏览器中单击该元素。现在应该在“元素”下突出显示它，这是在DOM中找到它的最简单方法。右键单击并删除它。如果仍然看到文字，则很可能会有多个叠加层，而只需要一个。