IconFont 图标的3种引用方式
第一步:进入阿里巴巴矢量图网站:http://www.iconfont.cn/
![](https://img2018.cnblogs.com/common/1553090/201912/1553090-20191225110745851-1831026477.png)
阿里巴巴矢量图
第二步:搜索你分类的关键字---然后加入购物车,下载到本地,然后解压,会将合并后的字体文件及自动生成的css全部下载
![](https://img2018.cnblogs.com/common/1553090/201912/1553090-20191225110807187-287196118.jpg)
解压后的文件
![](https://img2018.cnblogs.com/common/1553090/201912/1553090-20191225110904679-2113840256.jpg)
![](https://img2018.cnblogs.com/common/1553090/201912/1553090-20191225110912595-176664902.png)
第三步:打开demo_index.html,里面有刚才你选择的icon图标
![](https://img2018.cnblogs.com/common/1553090/201912/1553090-20191225110939684-1161339811.png)
第四步:从三种模式中选择一种 按照选择那种的步骤进行操作
我选择的是Symbol彩色的那种
效果展示:
另外两种也可以按着步骤来
注意: