天天看点

vue 引入iconfont图标库

  1. 进入inconfont官网:https://www.iconfont.cn/
  2. 选择/搜索想要的图标,加入购物车,
  3. 将加入到项目文件夹,若没有,就新建一个,取项目名
    vue 引入iconfont图标库

新建项目后,可以下载至本地

vue 引入iconfont图标库

4. 压缩包解压后,里面有这些文件

vue 引入iconfont图标库

5. 在需要的页面导入,如vue项目里导入:import ‘/assets/icon/iconfont.css’

6. 也可以打开demo_index.html文件

vue 引入iconfont图标库

demo_index.html里有引用的说明介绍

vue 引入iconfont图标库

7. 引用图标 ,例如

<i class="icon-zhaopinguanli"></i>