先打开
iconfont-阿里巴巴矢量图标库
https://www.iconfont.cn/
点击素材库
选择图标库
2023-09-01T14:39:54.png
找需要的图标
2023-09-01T14:40:29.png

鼠标移动到需要添加的图标上选择添加入库
2023-09-01T14:41:53.png
点击右上角购物车图标
2023-09-01T14:42:44.png
点击下载代码
2023-09-01T14:43:14.png
解压文件并放到网页文件夹中

2023-09-01T14:44:04.png
打开这个文件
2023-09-01T14:44:45.png

选择Font class
2023-09-01T14:45:17.png
复制代码
2023-09-01T14:45:58.png
根据文件所在路径更改路径
2023-09-01T14:48:33.png
将xxx删除
2023-09-01T14:49:37.png
返回原来的网页，复制.icon-后面的名字
2023-09-01T14:50:19.png
粘贴到原先删除xxx的位置
2023-09-01T14:51:13.png
打开网页
2023-09-01T14:52:18.png
可使用css样式更改大小，颜色等
2023-09-01T14:53:58.png
2023-09-01T14:54:15.png
代码示例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./font_7yrbhujnkx/iconfont.css">

<style>
    .icon-changsu{
        font-size: 40px;
        background-color: pink;
        color: #fff;
    }
</style>

</head>
<body>
    <span class="iconfont icon-changsu"></span>

</body>
</html>