Question

我经常使用google webfonts和我的网站项目，但我有一个特殊的问题，我不确定如何治愈。

在我的所有浏览器（OS X 10.8.2上的FF，Chrome和Safari）上，Open Sans常规字体粗细（400）显示为半粗体。以下是google's webfont library http://i.imgur.com/sZtWW.png上发生的一个例子：{{3}}

为了确保这是我的问题，我在browserstack中加载了该页面。在browserstack实例中，它显示了正确的字体粗细（Win 7上的Chrome 23）。

有谁知道问题是什么？

Answer 1

您在本地安装的Open Sans字体版本将覆盖页面CSS中指定的版本。

Google从其网站复制和粘贴的默认规则将优先使用本地字体。

要确保CSS指定的字体优先，请使用此CSS指令：

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url(https://themes.googleusercontent.com/static/fonts/opensans/v6/u-WUoqrET9fUeobQW7jkRT8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}

Google webfont无法显示正确的字体粗细

1 个答案: