elementuiplus修改el-checked多选框样式

废话不多说直接上代码：

1、给check加类名

 

2、css样式：

/deep/.image-checkbox .el-checkbox__input .el-checkbox__inner {

  /* 隐藏原生复选框 */

  display: none;

}

/deep/.image-checkbox .el-checkbox__input {

  /* 使用背景图片 */

  width: 40px;

  height: 40px;

  background-size: contain;

  background-repeat: no-repeat;

  background-position: center;

}

/deep/.image-checkbox .el-checkbox__input.is-checked {

  background-image: url('../../../assets/details/xz.png');

}

/deep/.image-checkbox .el-checkbox__input:not(.is-checked) {

  background-image: url('../../../assets/details/wxz.png');

}

/* 方法一的样式补充 */

/deep/.image-checkbox .el-checkbox__input {

  width: 20px;  /* 设置宽度 */

  height: 20px; /* 设置高度 */

  background-size: contain; /* 保持图片比例 */

}

 

最后的结果：