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;
}

具体效果:

相关推荐
恋猫de小郭1 小时前
Flutter Zero 是什么?它的出现有什么意义?为什么你需要了解下?
android·前端·flutter
崔庆才丨静觅7 小时前
hCaptcha 验证码图像识别 API 对接教程
前端
passerby60618 小时前
完成前端时间处理的另一块版图
前端·github·web components
掘了8 小时前
「2025 年终总结」在所有失去的人中,我最怀念我自己
前端·后端·年终总结
崔庆才丨静觅8 小时前
实用免费的 Short URL 短链接 API 对接说明
前端
执笔论英雄8 小时前
【大模型学习cuda】入们第一个例子-向量和
学习
wdfk_prog9 小时前
[Linux]学习笔记系列 -- [drivers][input]input
linux·笔记·学习
崔庆才丨静觅9 小时前
5分钟快速搭建 AI 平台并用它赚钱!
前端
ouliten9 小时前
cuda编程笔记(36)-- 应用Tensor Core加速矩阵乘法
笔记·cuda
崔庆才丨静觅9 小时前
比官方便宜一半以上!Midjourney API 申请及使用
前端