首先打开谷歌字体地址:https://fonts.google.com/,再选择字体样式,然后复制样式代码,粘贴到你的css样式表中就可以了。
实例代码:
<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <link href="https://fonts.googleapis.com/css2?family=Liu+Jian+Mao+Cao&family=Ma+Shan+Zheng&family=Noto+Serif+SC:wght@200&display=swap" rel="stylesheet">
    <style>
      p.p1{
        font-family:'Noto Serif SC', serif;
        font-size:20px;
        }
      p.p2{
        font-family:'Ma Shan Zheng',cursive;
        font-size:20px;
      }   
      p.p3{
        font-family:'Liu Jian Mao Cao', cursive;
        font-size:20px;
      }   
    </style>
  </head>
  <body>
    <h1>引用谷歌字体实例</h1>
    <p class="p1">这个字段使用了谷歌字体:Noto Serif SC</p>
    <p class="p2">这个字段使用了谷歌字体:Ma Shan Zheng</p>
    <p class="p3">这个字段使用了谷歌字体:Liu Jian Mao Cao</p>
  </body>
</html>
运行效果:

评论