Google Webfont 与本地字体冲突 [英] Google Webfont conflict with local font

问题描述

我在使用 google-webfonts 时遇到了非常严重的冲突.好的，代码如下:

I have a really bad conflict with using google-webfonts. OK here is the code:

这是在头脑中:

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

这是在 css 文件中:

And this is in the css-file:

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

"Oswald" 是 3 种字体的字体系列:

"Oswald" is a font-family of 3 fonts:

• 书 (300)
• 正常 (400)
• 粗体 (700)

如您所见……我只加载了粗体 (700).(你可以在查询中看到它)它一直工作到这里但是......

As you can see.. i've loaded only the bold-face (700). (you can see it in the query) And it works till here BUT …

问题在于:

我的计算机上安装了 3 种字体 (300,400,700) 的桌面版本，只要这些字体被激活……浏览器会在我的 html 文档中显示错误的字体粗细 (400).

I have a desktop-version of the 3 fonts (300,400,700) installed on my computer and as long as these fonts are activated … the browser shows me the wrong font-weight (400) in my html-document.

好的.问题是在我的 css 'Oswald' 中使用 localfont 而不是 webfont.但是本地字体Oswald"是Oswald normal".我不知道为什么谷歌称它为Oswald"而不是Oswald Bold".所以我不知道如何解决这个问题.

OK. The problem is that in my css 'Oswald' takes the localfont and not the webfont. But the local font "Oswald" is "Oswald normal". I don't know why google is calling it 'Oswald' instead of 'Oswald Bold'. So I don't know how to fix this problem.

我不希望 css 指向本地字体..我希望它始终显示 webfont ......因为正确的字体粗细！

I don't want the css to point at the local-font .. i want it to show always the webfont … because of the right font-weight!

你有什么想法吗?请?

可以重命名 webfont-call 吗?

Possible to Rename the webfont-call?

推荐答案

您可以编辑 CSS @font-face 规则以满足您的需要，而不仅仅是加载 Google 自动生成的规则.基本上问题在于他们的规则更喜欢本地版本(src: local('Oswald Bold'), local('Oswald-Bold'), ...).更正后的版本将如下所示:

You can edit the CSS @font-face rule to fit your needs instead of just loading the automatically-generated one from Google. Basically the issue is that their rule prefers local versions (src: local('Oswald Bold'), local('Oswald-Bold'), ...). The corrected verison would look like:

@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'; 当您想要使用该字体的 Google 网络版本时.

Just add that to your CSS manually, and use font-family: 'WebOswald'; when you want to use Google's Web version of the font.

希望有帮助！

这篇关于Google Webfont 与本地字体冲突的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！