外接显示器会影响Chrome字体清晰度

Question

我在Google Chrome中遇到字体清晰度问题。我正在www.transitioncville.org开发一个网站，使用@ font-face web fonts和FontAwesome在我的导航栏中渲染文本和图标。当我插入外接显示器（但Chrome窗口在我的macbook显示器上）并导航到我的网站时，我看到清晰明快的文字/图标：

如果我拔下外接显示器，我会继续获得清晰明快的文字/图标（即使我刷新页面或清除缓存）。但是，如果我在拔出外接显示器并导航到同一网站时打开新的Chrome标签页，则文字和图标会突然模糊（请参见下文）。我在其他机器上复制了这个。可能是什么导致了这个？这个问题似乎并不局限于FontAwesome，因为你也可以看到文本大量增加。

对于它的价值，Safari和Firefox似乎都没有任何问题。

Google Chrome 25.0.1364.172（Official Build 187217） OS Mac OS X. WebKit 537.22（@ 145275） JavaScript V8 3.15.11.17 Flash 11.6.602.180 用户代理Mozilla / 5.0（Macintosh; Intel Mac OS X 10_7_5）AppleWebKit / 537.22（KHTML，与Gecko一样）Chrome / 25.0.1364.172 Safari / 537.22

Answer 1

我不确定具体是什么，但是当使用以下CSS时，有时奇怪的浏览器特定字体渲染问题会消失。尝试将其添加到页面上包含的全局css文件中。

html, body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
}