单个图标
- 1. 进入阿里云矢量图标库的地址https://www.iconfont.cn
- 2.进入网站,选取某一个或多个点击你需要的图标 -> 添加入库。添加入库后点击购物车,添加至项目即可,名称自定。

- 3.点击生成代码,复制代码。在html文档(如标签中,和引用外部CSS文件一致)添加以下代码
<link rel="stylesheet" href="http://需要引用的CSS代码">
- 4.完成后,在你需要添加矢量图标的位置插入标签,如图所示:
<i class="iconfont 你的矢量图标名称"></i>
- 5.此时可以通过style样式设置矢量图标的大小和颜色,使用font-size属性控制图标大小,color控制其颜色
多个图标
- 1.进入我的项目,点击下载到本地

- 2.下载完成后文件目录如下:

- 3.在自己的HTML中引入上面的iconfont.css文件

- 4.在阿里云适量图标网站中我的项目找到要使用的图标类名

- 5.在HTML中添加以下代码
<i class="iconfont 你的矢量图标名称"></i>
- 6.此时可以通过style样式设置矢量图标的大小和颜色,使用font-size属性控制图标大小,color控制其颜色
留言