为什么 Font-Awesome 图标类不同

Question

为什么fontawesome图标类别有所不同

<script defer src="https://use.fontawesome.com/releases/v5.0.10/js/all.js" integrity="sha384-slN8GvtUJGnv6ca26v8EzVaR9DC58QEwsIk9q1QXdCU8Yu8ck/tL/5szYlBbqmS+" crossorigin="anonymous"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet" />


<i class="fa fa-edit"></i>
<i class="fas fa-pencil"></i>
<i class="fab fa-facebook"></i>

- Pranta Saha

---

有没有办法在不打开图标的情况下轻松复制标签？我知道你可以通过悬停或使用“cheat sheet”查看fa-icon名称...但是是否有任何方法可以知道图标是fas / fab / far等，而无需导航到图标页面？ - dcclassics

@dcclassics 是的，有一种方法。fab 用于品牌，因此很容易识别所有图标。fas - 实心图标通常填充有透明轮廓。far 正常和 fal 轻松相似。这些图标与 fas 实心图标不同，因为它们主要是轮廓，并且只在轮廓宽度上有所不同。与 far 正常相比，fal 轻松图标具有较细的轮廓线条。 - Jakub Muda

Answer 1

fa前缀在版本5中已被弃用。新的默认风格是fas实心样式，品牌图标使用fab风格。

请参考此链接：

https://fontawesome.com/how-to-use/on-the-web/referencing-icons/basic-use

- PHP Geek

Answer 2

请查看 Font Awesome 文档：https://fontawesome.com/how-to-use/on-the-web/referencing-icons/basic-use 这张图片包含了所有前缀的信息，因此没有更多内容需要添加 :) Font Awesome 5.10.0+ 加入了新前缀 fad 来支持双色图标。

- Jakub Muda

---

尽管此页面显示 fa 仍可在 fas 也能使用的情况下工作：https://fontawesome.com/how-to-use/on-the-web/setup/upgrading-from-version-4#changes - Jan Kyu Peblik

Answer 3

根据您的代码，我将给出答案。

Font Awesome是一个令人惊叹且易于使用的图标库。

• fa前缀已在版本5中弃用。新的默认样式是fas实心样式和fab品牌样式。
• 'fa'单独表示Font Awesome。它不再使用。但是我在之前的链接中使用它来展示我早期的网页作品，并且它正常工作。
• fas：Font Awesome实心图标。也是免费使用的。
• fab：Font Awesome品牌图标。免费使用。

上面提到的其他样式是：regular（far）、light（fal）和duotone（fad），都属于专业版，需要付费。

更多信息，请访问：https://fontawesome.com/v5.15/how-to-use/on-the-web/referencing-icons/basic-use

希望我已经详细解释清楚了。

- Fifi

Answer 4

FONT AWESOME 6

在 Font Awesome 6 中，您将拥有新的样式和新的类：

更多详情请参见：https://fontawesome.com/docs/web/setup/upgrade/whats-changed#full-style-names

- Jakub Muda