代码之家  ›  专栏  ›  技术社区  ›  BBaysinger alex

Google字体CDN:字体权重未按预期显示

  •  0
  • BBaysinger alex  · 技术社区  · 7 年前

    我试图在我的网站上使用谷歌字体的Lato。我在字体上看到了。谷歌。com、Lato具有不同的字体权重,它们有明显的区别:

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

    谁能告诉我是否正确使用了Lato和字体权重,或者告诉我如何使用字体权重?

    https://plnkr.co/Ng6Xk9S3TqGA2xzl7Nne

    <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>
    
    1 回复  |  直到 3 年前
        1
  •  0
  •   BBaysinger alex    7 年前

    多亏了Andrew Li,我意识到我是在为Open SAN而不是Lato添加字体权重。这是一个固定的Plunkr:

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

    修复方法是:

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