使用网络上最受欢迎的图标集和工具包Font Awesome，在您的网站上获取矢量图标和社交徽标。

图标列表：https://fontawesome.com/cheatsheet 

访问国外网站可能有些慢，可以访问：https://www.mchweb.net/atool/api/css/fontawesome/ 

图标搜索：https://fontawesome.com/icons?d=gallery&m=free 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="/css/fontawesome.css" rel="stylesheet">
    <link href="/css/brands.css" rel="stylesheet">
    <link href="/css/solid.css" rel="stylesheet">
    <style>
        <!--
        custom styling for all icons

        -->
        i.fas,
        i.fab {
            border: 1px solid red;
        }

        <!--
        custom styling for specific icons

        -->
        .fa-fish {
            color: salmon;
        }

        .fa-frog {
            color: green;
        }

        .fa-user-ninja.vanished {
            opacity: 0.0;
        }

        .fa-facebook {
            color: rgb(59, 91, 152);
        }
    </style>
</head>
<body>
    <i class="fas fa-fish"></i>
    <i class="fas fa-frog"></i>
    <i class="fas fa-user-ninja vanished"></i>
    <i class="fab fa-facebook"></i>
</body>
</html>

三种格式的icon：

solid(fas)：字体是黑色，背景色可以改变。（常用）

regular(far)

brands(fab)


注：文件一定要放全，否则出现各种错误：

（如下图，最少放下面三个文件夹）