el-table设置自定义css

隔行变色、表头颜色

css 复制代码
// 设置table字体颜色、背景色
.el-table {
  color: #ffffff;
  background-color: transparent !important;
}

设置隔行变色功能

css 复制代码
.el-table__body {
  tr.el-table__row {
    &:nth-child(even) {
      td.el-table__cell {
        background-color: #08417f;
      }
    }
    &:nth-child(odd) {
      td.el-table__cell {
        background-color: #0b3a74;
      }
    }
    &:hover {
      td.el-table__cell {
        background-color: #09529b;
      }
    }
  }
}

设置表头颜色

css 复制代码
.el-table thead {
  font-size: 14px;
  font-weight: 400;
  color: #479eff;
  background-color: #0064b3;
}
.el-table td.el-table__cell,
.el-table th.el-table__cell.is-leaf {
  border-bottom: none;
}
.el-table th,
.el-table tr,
.el-table td {
  background-color: transparent !important;
}
相关推荐
xingpanvip1 小时前
PHP+JS+CSS打造动态星盘计算器
javascript·css·php
爱上好庆祝2 小时前
clip-path裁剪,css的滤镜,动画时间线,css的变量和函数
前端·css·学习·html·css3
冲浪中台4 小时前
20个常用的CSS知识点
前端·css
CodeAI18 小时前
TailwindCSS 核心概念与实用技巧:从传统CSS到Utility-First迁移指南
css
乆夨(jiuze)1 天前
记录一个css,实现下划线内容显示,支持文本多行显示
前端·css
xiaotao1311 天前
CSS中的Grid 布局
前端·css
Hilaku1 天前
做中后台业务,为什么我不建议你用 Tailwind CSS?
前端·css·代码规范
二进制person1 天前
JavaEE进阶 --HTML+CSS+JavaScript 基础
javascript·css·html
fīɡЙtīиɡ ℡1 天前
【SpringAi最新版入门(二)】
java·javascript·css·人工智能·css3
小李子呢02111 天前
前端八股CSS(3)---水平垂直居中的实现方法
前端·css·css3