想要在button上显示自己的图片，而不是使用element-ui提供的el-icon
效果如图：中间这个按钮就是我自己的图片，devops.png
具体实现方法如下：
-
首先将图片引入，引入路径随你，我是将图片放到assets目录下
-
在按钮处自定义icon文章来源：https://www.toymoban.com/news/detail-619232.html
<el-button @click="to_devops(scope.row.pr_url)">
<i class="el-icon-devops" /> // 自定义icon，这个el-icon-devops是我自己命名的
</el-button>
- 在css中设置el-icon-devops
::v-deep .el-icon-devops {
background: url('../../../assets/devops.png') center no-repeat; // 注意此处的url，在这里引入自己的图片
font-size: 12px;
background-size: cover;
}
::v-deep .el-icon-devops:before {
content: "替";
font-size: 12px;
visibility: hidden;
}
最后就可以显示出来啦。我用的是默认按钮，所以背景是白色的，如果想要其它背景色可以自己调。文章来源地址https://www.toymoban.com/news/detail-619232.html
到了这里，关于el-button自定义图片显示的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
