el-table表格样式修改

javascript 复制代码
<el-table
            :data="dateList"
            stripe
            max-height="95%"
            
            :header-cell-style="{
              background: '#004bff',
              color: '#fff',
              'font-size': '24px',
              height: '80px',
            }"
          ></el-table>
css 复制代码
::v-deep.el-table {
    background-color: transparent;
    border: 1px solid #3278ff;
    &.el-table::before {
      background-color: transparent;
    }
    .el-table__empty-text {
      color: #d2e6ff;
      font-size: 28px;
      line-height: 120px;
    }
    th.el-table__cell.is-leaf {
      border-bottom: none !important;
    }
    .el-table__row--striped {
      background-color: transparent;
    }
    .el-table__header tr,
    .el-table__header th {
      // background: #112c3c;
      padding: 5px 0;
    } //表头

    th,
    tr {
      background-color: transparent;

      .cell {
        color: #d2e6ff;
        background-color: transparent;
      }
    }
    .el-table__body-wrapper {
      .el-table__cell {
        border-bottom: 1px solid #3278ff !important;
      }
      th,
      tr {
        background-color: transparent;
        .cell {
          height: 56px;
          line-height: 56px;
          font-size: 24px;
          color: #d2e6ff;
          background-color: transparent;
        }
      }
    }
    /* 取消el-table鼠标移入高亮 */
    .el-table__body tr:hover > td {
      // background-color:#113176 !important;
      background-color: transparent !important;
    }
    .el-table__body tr.current-row > td {
      background-color: transparent !important;
      // background-color:#113176 !important;
    }
    .el-table__row--striped > td {
      background-color: rgba($color: #3278ff, $alpha: 0.15) !important;
    }
  }
相关推荐
code_YuJun1 小时前
corepack 作用
前端
千寻girling1 小时前
Koa.js 教程 | 一份不可多得的 Node.js 的 Web 框架 Koa.js 教程
前端·后端·面试
全栈前端老曹1 小时前
【MongoDB】Node.js 集成 —— Mongoose ORM、Schema 设计、Model 操作
前端·javascript·数据库·mongodb·node.js·nosql·全栈
code_YuJun1 小时前
pnpm-workspace.yaml
前端
天才熊猫君1 小时前
“破案”笔记:iframe动态加载内容后,打印功能为何失灵?
前端
五月君_1 小时前
炸裂!Claude Opus 4.6 与 GPT-5.3 同日发布:前端人的“自动驾驶“时刻到了?
前端·gpt
Mr Xu_1 小时前
前端开发中CSS代码的优化与复用:从公共样式提取到CSS变量的最佳实践
前端·css
低代码布道师2 小时前
Next.js 16 全栈实战(一):从零打造“教培管家”系统——环境与脚手架搭建
开发语言·javascript·ecmascript
鹏北海-RemHusband2 小时前
从零到一:基于 micro-app 的企业级微前端模板完整实现指南
前端·微服务·架构
LYFlied2 小时前
AI大时代下前端跨端解决方案的现状与演进路径
前端·人工智能