el-table组件样式如何二次修改?

文章目录


前言

ElementUI中的组件el-table表格组件提供了丰富的样式,有一个全选框的el-table组件,提供了全选框和多选。


一、去除全选框按钮样式

原本默认是有全选框的。假如有一些开发者,因为某些需求,不想要这个全选框按钮,我们可以通过样式修改掉这个全选框按钮。(本人碰到过这种需求)

二、表头颜色的修改

原本是这样的。

我们只需要加入这两行代码就可以修改默认样式:

c 复制代码
/* 全选按钮消失 */
::v-deep
  .el-table__header
  thead
  th:nth-child(1)
  .cell
  .el-checkbox
  .el-checkbox__input
  .el-checkbox__inner {
  display: none;
}
/* 表头颜色 */
:deep(.el-table thead) {
  color: black;
}

具体效果:

相关推荐
Hilaku7 分钟前
深入background-image:你可能不知道的几个性能优化与高级技巧
前端·css
南岸月明9 分钟前
副业自媒体1年终于明白:为什么会表达的人,能量越来越强,更能赚到钱?
前端
两颗泡腾片13 分钟前
黑马程序员C++核心编程笔记--类和对象--运算符重载
c++·笔记
Danny_FD23 分钟前
Vue + Element UI 实现模糊搜索自动补全
前端·javascript
gnip28 分钟前
闭包实现一个简单Vue3的状态管理
前端·javascript
斐济岛上有一只斐济33 分钟前
后端程序员的CSS复习
前端
Enddme36 分钟前
《面试必问!JavaScript 中this 全方位避坑指南 (含高频题解析)》
前端·javascript·面试
有梦想的程序员38 分钟前
微信小程序使用 Tailwind CSS version 3
前端
wocwin1 小时前
Vue移动端项目二次封装原生table组件,支持表头/数据动态配置(支持多级表头、排序);作用域插槽、render函数渲染某列数据等功能
vue.js
你怎么知道我是队长1 小时前
python---eval函数
开发语言·javascript·python