element 表格修改

表头样式

th{
    background: #04020d !important;
    color: rgba(202,207,239,0.80);
    line-height: 17px;
  }

表格为空的时的样式

.el-table__empty-block{
    color: #CACFEF !important;
    background: #261A55 !important;
  }

表格斑马线样式

.el-table--striped .el-table__body tr.el-table__row--striped td {
  background: #04020d !important;
}

鼠标悬浮样式

&--enable-row-hover &__body tr:hover>td {
    background-color: transparent !important;
  }

表格列样式

tr{
    color: #CACFEF !important;
    background: #261A55 !important;
  }
 td, th.is-leaf {
    border-bottom: transparent !important;
  }
&::before{
    border-bottom: transparent !important;
    background: transparent !important;
  }

其他

  tr, td, th{
    padding: 0 !important;
    height: 44px !important;
  }
  .cell , th>.cell{
    padding-left: 18px !important;
  }
}

滚动条修改

.el-table{
&__body-wrapper{
    &::-webkit-scrollbar {
      width: 8px; // 横向滚动条
      height: 8px; //纵向滚动条
    }
    // 滚动条的滑块
    &::-webkit-scrollbar-thumb {
      background-color: #4F2BDB;
      border-radius: 4px;
    }
    &::-webkit-scrollbar-track{/*滚动条里面轨道*/
      border-radius: 4px;
      background-color: transparent;
    }
  } 
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容