4

我在 Google Chrome 中遇到字体清晰度问题。我正在 www.transitioncville.org 上开发一个网站，使用 @font-face 网络字体和 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 User Agent Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_5) AppleWebKit/537.22 (KHTML, like壁虎）Chrome/25.0.1364.172 Safari/537.22

4

1 回答 1

0

我不确定具体发生了什么，但是当使用以下 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%;
}
于 2014-09-24T00:58:53.650 回答