如何修改el-table的样式

如图,如何将默认的selection的打勾的样式图1,修改成图2的样式
图1:image.png
图2 :image.png

阅读 3.8k
2 个回答

如果只是争对某一个页面的这个复选框进行修改样式的话,就写在组件里面的style,并且在scoped,因为加了scoped,我们修改element ui默认样式需要加上前缀/deep/,避免影响其他组件的样式。

<style scoped>
/deep/.el-checkbox__input.is-checked .el-checkbox__inner {
    background-color: #fff;
    border-color: #ddd;
}
/deep/.el-checkbox__inner:after {
    border-color: #409eff;
}
</style>

如果你想要修改全局的复选框样式,那么就直接写在全局样式表里, 无需加deep前缀。

查看该元素类名,直接覆盖样式,如果要全局生效不要加scope,或单独写一个css引入,如果只是组件内覆盖就scope + /deep/

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题