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

具体效果:

相关推荐
陈卓4108 分钟前
Redis-限流方案
前端·redis·bootstrap
顾林海17 分钟前
Flutter Dart 运算符全面解析
android·前端
孤寂大仙v23 分钟前
【Linux笔记】理解文件系统(上)
linux·运维·笔记
七月丶23 分钟前
🚀 现代 Web 开发:如何优雅地管理前端版本信息?
前端
ianozo25 分钟前
数据结构--【栈与队列】笔记
数据结构·笔记
漫步云端的码农25 分钟前
Three.js场景渲染优化
前端·性能优化·three.js
悬炫25 分钟前
赋能大模型:ant-design系列组件的文档知识库搭建
前端·ai 编程
用户1083863868030 分钟前
95%开发者不知道的调试黑科技:Apipost让WebSocket开发效率翻倍的秘密
前端·后端
稀土君1 小时前
👏 用idea传递无限可能!AI FOR CODE挑战赛「创意赛道」作品提交指南
前端·人工智能·trae
OpenTiny社区1 小时前
Node.js 技术原理分析系列 4—— 使用 Chrome DevTools 分析 Node.js 性能问题
前端·开源·node.js·opentiny