1. WordPress 自带图标库 【Dashicons】
查询图标地址： https://developer.wordpress.org/resource/dashicons/
仅 WordPress 后台使用 或者 当前页面带有 /wp-includes/css/dashicons.min.css?ver=5.7 类似的CSS文件才能正常显示图标
2. 排名第一的字体图标库 【Fontawesome 5.X】
查询图标地址：https://fontawesome.com/icons?d=gallery
CDN地址：https://www.bootcdn.cn/font-awesome/
在<head>处加载font-awesome.min.css如下。
<link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/5.15.3/css/all.min.css" rel="stylesheet">
注意：
- 免费版支持三种样式：solid、regular和brands，后面在使用图标时根据样式的不同也会有不同的前缀
- Font Awesome旨在与内联元素一起使用，我们建议使用一致的HTML元素以在项目中引用它们。 我们喜欢<i>标签的简洁性，因为最近大多数人都在使用<em> </em>来强调/斜体化语义文本。 如果那不是您的理想之选，那么在语义上使用<span>更为正确。
- fa前缀在5.x版本中已弃用。新的默认设置是实心的fas样式和品牌的fab样式。
- 两大要素显示图标 1.以fa-为前缀的名称；2.要使用的相应前缀的样式；
基本用法
<i class="fas fa-camera-retro"></i><!-- 实心样式 -->
<i class="fal fa-camera-retro"></i><!-- 细体样式 仅专业版 -->
<i class="fad fa-camera-retro"></i><!-- 双色样式 仅专业版 -->
<i class="fab fa-alipay"></i><!-- 品牌样式 -->
固定宽度
是否需要垂直对齐一系列图标，例如列表或导航菜单中的图标？ 对于这些情况，我们提供了固定宽度的样式支持。
在引用您的图标的HTML元素上添加fa-fw类，以将一个或多个图标设置为相同的固定宽度。 当更改图标宽度（例如，宽而短的图标上方的高而瘦的图标）会使得所有图标垂直对齐时，这个功能非常有用。 为了清晰，在下面的示例中，我们在图标上添加了背景色，以便您可以看到固定的宽度，还可以增大父元素的字体大小。
<i class="fas fa-skating fa-fw" style="background: DodgerBlue;"></i>
<i class="fas fa-skiing fa-fw" style="background: SkyBlue;"></i>
<i class="fas fa-skiing-nordic fa-fw" style="background: DodgerBlue;"></i>
<i class="fas fa-snowboarding fa-fw" style="background: SkyBlue;"></i>
<i class="fas fa-snowplow fa-fw" style="background: DodgerBlue;"></i>
列表中的图标
在固定宽度样式的垂直对齐的基础上，我们添加了一些实用样式，以处理带有用作装饰项目符号的图标的HTML列表。
使用fa-ul和fa-li替换无序列表中的默认项目符号。
- List icons can
- be used to
- replace bullets
- in lists
<ul class="fa-ul">
<li><span class="fa-li"><i class="fas fa-check-square"></i></span>List icons can</li>
<li><span class="fa-li"><i class="fas fa-check-square"></i></span>be used to</li>
<li><span class="fa-li"><i class="fas fa-spinner fa-pulse"></i></span>replace bullets</li>
<li><span class="fa-li"><i class="far fa-square"></i></span>in lists</li>
</ul>
