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

具体效果:

相关推荐
楠木6856 分钟前
RAG 资料库 Demo 完整开发流程
前端·ai编程
观书喜夜长8 分钟前
大模型应用开发学习-基于 LangChain 框架实现的交互式问答脚本
python·学习
中屹指纹浏览器14 分钟前
2026指纹浏览器性能瓶颈分析与优化技巧
经验分享·笔记
肠胃炎17 分钟前
挂载方式部署项目
服务器·前端·nginx
像我这样帅的人丶你还25 分钟前
使用 Next.js + Prisma + MySQL 开发全栈项目
前端
FPGA小迷弟25 分钟前
FPGA 时序约束基础:从时钟定义到输入输出延迟的完整设置
前端·学习·fpga开发·verilog·fpga
Kel25 分钟前
深入剖析 openai-node 源码:一个工业级 TypeScript SDK 的架构之美
javascript·人工智能·架构
毛骗导演44 分钟前
@tencent-weixin/openclaw-weixin 插件深度解析(四):API 协议与数据流设计
前端·架构
毛骗导演1 小时前
@tencent-weixin/openclaw-weixin 插件深度解析(二):消息处理系统架构
前端·架构
IT_陈寒1 小时前
深入理解JavaScript:核心原理与最佳实践
前端·人工智能·后端