字体系列“Poppins”在加载时无法在我的网站上正常工作

Question

首先我要感谢这个网站上所有伟大的人。如果没有 SO 的帮助，我会很迷失。

我正在尝试引用谷歌字体的排版。问题是，当我推送更改时，字体将显示在控制台上，但不会在实际网站上呈现。

这是我导入代码的方式

<style>
@import url('https://fonts.googleapis.com/css?family=Poppins:400,700,900');
</style>

.text{ 
    font-family: 'poppins-bold', sans-serif !important;
    font-size: 6.3rem;
    line-height: 1.333;
    margin-top: 0;
    color: #FFFFFF;
    text-align: center;
}

请查看此处的网站并亲自查看。

有什么方法可以解决这个问题吗？

Answer 1

只需添加

    <style>
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@700&display=swap');
</style>

然后在css里面

   *{
font-family: 'Poppins', sans-serif;
}

Answer 2

您可以尝试在index.html（主html文件）中添加以下链接，然后您可以使用font-family作为'poppins'。

<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Poppins" />

（您必须使用 <> 将其包装起来以使其成为标签）