如何正确包含谷歌字体供CSS使用？

Question

我现在正在使用这个字体：

https://www.google.com/fonts#UsePlace:use/Collection:Roboto

根据指南，我只需要包含这样的链接

我已经尝试过了......但是我的问题是：

Firefox和Chrome的输出不同......

铬：

火狐：

正如你可以从两张图片中看到的...... Firefox正确地显示它......

我在这里缺少什么？从铬显示不是那么好..任何帮助将不胜感激..

Answer 1

这取决于浏览器的默认字体。您没有在样式中指定font-weight。如果你在样式中添加font-weight: 300;，你应该会看到同样的事情。

修改我发现您在Google字体中添加的样式会导致问题。如果您只添加300和300 italic，则会产生更好的结果。 http://jsfiddle.net/5mnq06km/5/

body {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
}
b {
  font-weight: bold;
}

<link href='https://fonts.googleapis.com/css?family=Roboto:300,300italic' rel='stylesheet' type='text/css'>

<p>
  Some <b>Text</b>
</p>

Answer 2

定义体内字体的重量，以便所有浏览器都能同样处理它。

字体重量：300;