为什么我的 Font Awesome 图标显示为正方形而不是符号？

Font Awesome 未按预期显示图标：出现方块

当符号显示为空的方块。此问题通常是由于 Font Awesome 类的错误实现而引起的。

如何包含 Font Awesome 文件

您提供的 HTML 代码包含 Font 所需的 CSS 文件太棒了：

<link rel="stylesheet" href="css/font-awesome.css">

错误：缺失类

你的代码使用了不完整的图标类：

<i class="icon-camera-retro"></i>

要正确显示图标，你需要两个类：fa类和指定图标的类，比如作为 fa-camera-retro。

正确实现

<i class="fa fa-camera-retro"></i>

Bootstrap 5 更新

在 Bootstrap 5 中，fa 前缀已被弃用。新的默认值是 fas（实体样式）和 fab（品牌样式）：

<i class="fas fa-camera-retro"></i>  <!-- Solid icon -->
<i class="fab fa-twitter"></i>        <!-- Brand icon -->

通过应用正确的类，Font Awesome 图标将按预期呈现，消除以前阻碍您设计的麻烦方块.

以上是为什么我的 Font Awesome 图标显示为正方形而不是符号？的详细内容。更多信息请关注PHP中文网其他相关文章！