为什么某些Google字体以斜体样式显示不正确

Question

我在使用某些Google字体时遇到了一个奇怪的问题.

例如,我使用的是Muli字体,在某些浏览器中,当CSS规则为:时,文本以斜体显示:

p {
    font-style: normal;
}

我还用几个浏览器打开了Google Web Fonts网站(我在6台不同的PC和Mac上测试了16种不同的浏览器),其中只有两个我遇到了问题(一个在Chrome浏览器上,另一个在Firefox浏览器上) ).

此屏幕截图显示了Firefox中显示的字体与显示斜体字体的浏览器的并排比较

为什么只有一些浏览器会将这些字体显示为斜体？在追踪这个问题时我应该寻找什么？

Answer 1

投机！如果您在两台不同的计算机上使用相同的浏览器和浏览器版本进行测试，则字体的差异可能来自操作系统。使用 Google 的 API，当调用 Firefox 或 Chrome 时，会使用本地属性，调用该字体的操作系统版本（如果可用）。其中操作系统调用或给出的字体可以是斜体版本而不是普通字体。

我的建议是下载字体并自己手动导入，而不使用本地属性。

当您导入 Google 字体 API 时，会发生以下情况：

例如，来自 Firefox 的 Inconsolata 请求将返回以下 CSS：

@font-face {
  font-family: 'Inconsolata';
  src: local('Inconsolata'), url('http://themes.googleusercontent.com/fonts/font?kit=J_eeEGgHN8Gk3Eud0dz8jw') format('truetype');
}

另一方面，来自 Internet Explorer 的请求返回：

@font-face {
  font-family: 'Inconsolata';
  src: url('http://themes.googleusercontent.com/fonts/font?kit=J_eeEGgHN8Gk3Eud0dz8jw');
} 

https://developers.google.com/webfonts/docs/technical_considerations