實(shí)現(xiàn)
button的icon屬性自定義一個(gè)圖標(biāo)名稱，這個(gè)自定義的圖標(biāo)名稱會(huì)默認(rèn)添加到button下i標(biāo)簽的class上，我們只需要設(shè)置i標(biāo)簽的樣式就可以了
##3. 按鈕上使用自定義的icon文章來(lái)源：http://www.zghlxwxcb.cn/news/detail-752876.html
文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-752876.html
完整代碼
<div class="lookBtn">
<el-button icon="el-icon-my-message" size="mini" type="primary"
@click="checkAllTask">
查看任務(wù)
</el-button>
</div>
樣式代碼
::v-deep .el-icon-my-message {
background: url('../../assets/images/lookMsg.png') center no-repeat;
width: 21px;
height: 26px;
}
::v-deep .el-icon-my-message:before {
content: "替";
font-size: 20px;
visibility: hidden;
}
::v-deep .el-icon-my-message {
font-size: 16px;
}
::v-deep .el-icon-my-message:before {
content: "\e611";
}
到了這里，關(guān)于vue+element ui中的el-button自定義icon圖標(biāo)的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
