VUE element-ui中el-button使用iconfont图标_el-button icon

步骤：
1、进入iconfont官网传送门并使用任意方式登录。

2、按如下步骤进行：

3.图标库建好后直接搜索自己需要的图标按如下步骤：





4、将文件解压后，在项目assets下新建文件，将解压文件放入

5、在main.js中引入：

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

  
  

  
  
1

6、在标签中使用类名引入图标：

<el-button style="margin-left: 4px" class="filter-item iconfont icon-zhuangtai" type="primary" size="mini" @click="exportExcel">设置状态</el-button>
//注意：类名iconfont必须加

  
  

  
  
1
2

7、页面效果：

可以看到字体样式太大
8、修改样式：

看下修改后的效果：

可以看到和其他相同的效果；
注意：这里icon-font将图标作为文字格式处理，即修改字体大小样式，icon随之改变