提问者:小点点

字体很棒的字体


我最近使用npm从站点安装了font-awesome。 当我在HTML文件中使用它时,它最终会在页面上显示方块而不是图标。 有人能帮我一下吗?

我正在使用fontawesome图标的代码:

<li class="nav-item active"><a class="nav-link" href="index.html"><span class="fas fa-home"></span> Home</a></li>

我也包括了CSS。


共1个答案

匿名用户

黑色方块通常表示字体类型错误。 但我不能肯定地说。 尝试使用san serif,否则你可以在这篇文章中查看答案:Font awesome不显示图标

最佳答案:
在我的情况下,我在css代码中犯了以下错误。

*{
    font-family: 'Open Sans', sans-serif !important;
}

这将覆盖整个页面的所有字体系列规则。 我的解决方案是将代码移动到body,就像这样。

body{
    font-family: 'Open Sans', sans-serif;
}

注意:无论何时在css中使用!重要标志,在同一元素上声明的同一类型的任何其他css规则都将被覆盖。
答案:Daniel Barde

--

它也可以取决于您如何导入库,是通过CDN还是通过文件夹?

通过CDN:检查路径/url是否正确(可能是未经授权的链接?)。
通过文件夹/下载:可能使用“/fonts/fontawesome-free-5.3.1-web/css/all.css”而不是“/fonts/fontawesome-free-5.3.1-web/css/fontawesome.css”。