使用iconfont快速加图标

网址:https://www.iconfont.cn/
今日被要求加几个图标,表示退出登录、消息、待办事项、头像图标.
拿到任务先思考一下怎么做合适,参考了一下大家意见都觉得iconfront最适合不过了.
使用阿里图标呢,有两种方式
第一种,直接下载:可下载svg\png等,还可以调节大小,颜色等信息,也是很方便的.也支持多个一起下载,先添加至小车,后下载.

第二种:
1.把图标选择好加入小车,在小车里添加至项目

2.根据所需可单独编辑图标设置大小颜色,图标格式.然后下载至本地

3.下载的压缩包,解压后里面有个demo_index.html文件,点击浏览器打开,可看到每个图标的名字

4.把除了demo_index.html和demo.css以外的其他文件引进项目,就可以直接使用了.(一般放至assets文件夹下面)

5.全局或根据所需import

import './assets/iconfont/iconfont.css'

6.项目中直接使用就可以了,class里面添加上html文件里看到的图标名字

    <span class="iconfont icon-daiban"></span>
    <span class="iconfont icon-yonghu"></span>
   	<span class="iconfont icon-tuichu"></span>

7.大功告成