与本地字体谷歌web字体冲突(Google Webfont conflict with local

2019-06-27 09:36发布

我有一个使用谷歌,网络字体的一个非常糟糕的冲突。 OK这里是代码:

这是头:

<link href='http://fonts.googleapis.com/css?family=Oswald:700' rel='stylesheet' type='text/css'>

这是在CSS文件:

body {
font-family: 'Oswald', sans-serif;
font-weight: 700; }

奥斯瓦德 ”是3种字体的FONT-FAMILY:

  • 书(300)
  • 正常(400)
  • 大胆的(700)

正如你所看到的..我已经加载只有粗体字(700)。 (你可以看到它在查询),它工作到这里,但...

问题是:

我有3种字体(300400700)安装在我的电脑上,只要这些字体被激活......浏览器显示了我的HTML文档中的错误的字体重量(400)的桌面版本。

好。 问题是,在我的CSS“奥斯瓦尔德”采取localfont而不是web字体。 但本地字体“奥斯瓦德”是“奥斯瓦德正常”。 我不知道为什么谷歌被称之为“奥斯瓦德”而不是“奥斯瓦尔德大胆”。 所以我不知道如何解决这个问题。

我不想css来在本地字体点..我希望它始终显示web字体......因为正确的字体重的!

你有什么想法? 请?

可以重命名web字体通话?

Answer 1:

您可以编辑CSS @font-face规则来满足您的需求,而不是只加载从谷歌自动生成一个。 基本上,问题是,他们的统治更喜欢本地版( src: local('Oswald Bold'), local('Oswald-Bold'), ... )。 修正verison将如下所示:

@font-face {
  font-family: 'WebOswald';
  font-style: normal;
  font-weight: 700;
  src: url(https://themes.googleusercontent.com/static/fonts/oswald/v5/bH7276GfdCjMjApa_dkG6T8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}

只需手动添加到您的CSS,并使用font-family: 'WebOswald'; 当你想使用的字体的谷歌的Web版本。

我希望帮助!



文章来源: Google Webfont conflict with local font