Font Awesome 图标未显示，但其他显示

Question

我见过很多人遇到这个问题，但他们都有不同的解决方案，但 none 对我有用。我试过将“fa”更改为“fas”和“fab”，我导入了一堆 CDN、文件、all.css、链接和 none。但它适用于某些图标。例如，这个有效：

<i class="fas fa-scissors"></i>

但这个没有：

<i class="fas fa-person-fill"></i>

我该如何解决这个问题？

我试过将“fa”更改为“fas”和“fab”，我导入了一堆 CDN、文件、all.css、链接和 none。但它适用于某些图标。例如，这个有效：

<i class="fas fa-scissors"></i>

但这个没有：

<i class="fas fa-person-fill"></i>

我该如何解决这个问题？

Answer 1

图标名称后面的fill是bootstrap的东西但是你需要把fa或者fas改成bi

查看 bootstrap and font-awesome

的可用图标

以下是如何同时使用真棒字体和 bootstrap 图标的方法：

<!--  Font Awesome cdn -->
<link rel="stylesheet" 
 href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css">


<!--  Bootstrap cdn -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.8.1/font/bootstrap-icons.css">


 
<h5>font awesome Icon :</h5>
<i class="fa fa-person"></i>

<h5>Bootstrap Icon :</h5>
<i class="bi bi-person-fill"></i>

Answer 2

您不需要将“fill”作为名称的一部分 - “FAS”前缀代表“Font Awesome SOLID” - 因此默认填写

<!--  Font Awesome cdn -->
<link rel="stylesheet" 
 href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css">
 
 <p>fas fa-scissors</p>
<i class="fas fa-scissors"></i>

<p>fas fa-person</p>
<i class="fas fa-person"></i>

Font Awesome 图标未显示，但其他显示

Font Awesome icon not showing, but other do

html

css

font-awesome