vue 引入iconfont字体库

1.登录官网 https://www.iconfont.cn/  

2.选择所需要的图标加入图库

新建项目 选择fontClass 并下载到本地   目录如下

3.项目 assets目录下 新建  iconfont 文件夹 并把所有的文件都复制过来(为了以后方便别人查阅) 打开  iconfont.css,添加如下代码:

[class^="icon"], [class*=" icon"] {
  font-family:"iconfont" !important;
  /* 以下内容参照第三方图标库本身的规则 */
  font-size: 18px;
  font-style:normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

注意第二个class前面有个空格

4. 在 main.js添加 

//引入字体库
import './assets/iconfont/iconfont.css'

模块中使用  :  <i class="icon iconfont icon-filter"></i>

 

posted @ 2019-04-17 10:04  美力  阅读(1085)  评论(0编辑  收藏  举报