0

我看过很多关于这方面的帖子，但人们已经写到它只是在 Windows Chrome 中呈现不正确。就我而言，它是大多数浏览器，包括 IE。Cleartype 默认情况下是打开的，所以这不是问题。

我不敢相信 Windows 不能正确处理 Google 字体。也许，那里的某个人可能有一个可行的解决方案或一个合理的后备方案。

仅将 Arial 用于 Windows 机器是否明智？是否有检测操作系统类型的脚本，如果有，我应该实现它吗？我知道我应该只选择一种基本字体，但我还不如取悦 OSX 人群？

编辑：

我应该补充一点，我正在使用 News Cycle。在 18px 及以下的 Google 字体网站上，它甚至看起来有点糟糕。

4

3 回答 3

2

我不知道锯齿状渲染问题，但对于回退，您可以使用navigator.userAgentJavaScript 中的属性检测操作系统。

Windows 用户代理包含 substring NT x.y，例如NT 6.1用于 Windows 7。

编辑：您也可以使用该navigator.appVersion属性。这是一个示例：

if(navigator.appVersion.indexOf("Win") != -1)
    OS = "Windows";
if(navigator.appVersion.indexOf("Mac") != -1)
    OS = "MacOS";
if(navigator.appVersion.indexOf("X11") != -1)
    OS = "Unix";
if(navigator.appVersion.indexOf("Linux") != -1)
    OS = "Linux";

if(OS == "Windows") {
    //add specific styles
}

要自动化该过程，您可以使用CSS User Agent，它根据操作系统向元素添加类。

于 2012-09-04T20:05:44.480 回答
1

明智地选择字体并始终进行测试。谷歌字体是一个了不起的资源，但并非每种字体都能在所有浏览器/平台上正确显示甚至清晰可见。

编辑：谷歌上有很多关于字体的资源。您需要研究“字体堆栈”，这将为您选择后备字体提供一些启示。恕我直言，在这种情况下，我真的不认为用户代理嗅探是必要的......

这是一篇很好的文章，虽然有点旧： http ://coding.smashingmagazine.com/2009/09/22/complete-guide-to-css-font-stacks/

于 2012-09-04T20:11:51.347 回答
1

我只在 Windows 上的 Chrome 中遇到过问题。以前的解决方法是添加不可见的文本阴影或稍微旋转文本，但从版本 16 开始就停止工作了。我发现有时以下 CSS 属性可以帮助处理某些字体：

-webkit-text-stroke-width: .5px;
于 2012-09-04T20:28:18.707 回答