Question

我正在尝试在我的网站中使用来自Google字体的Lato。我在fonts.google.com上看到，Lato有不同的字体权重，它们有明显的区别：

https://fonts.google.com/specimen/Lato

在实践中，我没有看到它们之间存在太大差异，这使我网站上的设计变得复杂。

有人能告诉我，我是否正确使用了Lato和字体权重，或者告诉我如何使用字体权重？

<head>
  <link rel="stylesheet" href="style.css">
  <script src="script.js"></script>
  <link href="https://fonts.googleapis.com/css?family=Lato|Open+Sans:500,600,700,800" rel="stylesheet">
</head>

<style>
  body {
    font-family: 'Lato', sans-serif
  }
</style>

<body>
  <div style="font-weight:500">This is a test!</div>
  <div style="font-weight:600">This is a test!</div>
  <div style="font-weight:700">This is a test!</div>
  <div style="font-weight:800">This is a test!</div>
</body>

Answer 1

感谢Andrew Li，我意识到我包括Open Sans的字体权重，而不是Lato。这是一个固定的Plunkr：

https://plnkr.co/edit/9mKXYie2BdMvkf3uuvgn

修复是：

<link href="https://fonts.googleapis.com/css?family=Lato:400,700,900" rel="stylesheet">

Google字体：字体粗细未按预期显示

1 个答案: