前提
elementui图标库图标较少
当你想用elementui的控件而不想用它的图标时,就能够应用自定义的形式来实现
实现
el-icon-my-export为我自定义的图标命名
<el-button class="default" icon="el-icon-my-export">导出</el-button>//应用图片来替换//before属性中的content文本是用来占位的,必须有//能够设置字体大小来确定大小//应用visibility: hidden;来暗藏文字.el-icon-my-export{ background: url(/officeHouse/resources/images/export.png) center no-repeat; background-size: cover;}.el-icon-my-export:before{ content: "替"; font-size: 16px; visibility: hidden;}//如果间接应用字体图片//间接在before属性设置对应的content就行.el-icon-my-export{ font-size: 16px;}.el-icon-my-export:before{ content: "e611";}
content外面应用汉字大小会比拟失常,然而汉字有时候会呈现乱码,能够应用Unicode编码
//编码后的的替为 u66ff//书写到css外面的时候须要去掉u.el-icon-my-export:before{ content: "66ff"; font-size: 16px; visibility: hidden;}