当前位置:   article > 正文

element ui表格el-table样式自定义调整_element table 自定义

element table 自定义

效果图

![在这里插入图片描述](https://img-blog.csdnimg.cn/28d6f061915f441f94dcc89ac0b70e96.png在这里插入图片描述

1.dom元素

查看

2.css

.tfsjzt-table-wrap{
width: 1464px;
background: transparent;
}
.tfsjzt-table-wrap .el-table{
background: transparent;
}
.tfsjzt-table-wrap .el-table::before{
display: none;
}
.tfsjzt-table-wrap .el-table td,
.tfsjzt-table-wrap .el-table th {
padding: 0;
color: #fff;
font-size: 28px;
border: none;
}
.tfsjzt-table-wrap .el-table td.el-table__cell, .el-table th.el-table__cell.is-leaf{
border: none;
}
.tfsjzt-table-wrap .el-table th .cell {
height: 55px;
background: transparent;
line-height: 55px;
}
.tfsjzt-table-wrap .el-table thead tr th {
height: 55px;
background: transparent;
line-height: 55px;
border: none;

font-size: 28px;
font-family: Alibaba PuHuiTi;
font-weight: 500;
color: #D9F7FF;
}
.tfsjzt-table-wrap .el-table tr {
height: 55px;
line-height: 55px;
font-size: 28px;
font-family: Alibaba PuHuiTi;
font-weight: 500;
color: #D9F7FF;
border: none;
background: transparent;
}
.tfsjzt-table-wrap .el-table thead tr{
background-image:url(‘…/imgs/screenNew/tfsjzt/table-bg.png’);
background-repeat: no-repeat;
background-size: 100% 100%;
}
.tfsjzt-table-wrap .el-table tr td{
border: none;
background: transparent;
}
.tfsjzt-table-wrap .el-table tr:hover td.el-table__cell{
background: rgba(46, 75, 141, .4);
}
.tfsjzt-table-wrap .el-table .el-table__body tr td{
background: rgba(46, 75, 141, .4);
height: 52px;
font-size: 28px;
font-family: Alibaba PuHuiTi;
font-weight: 400;
color: #D9F7FF;
}
.tfsjzt-table-wrap .el-table .el-table__body{
border-collapse: separate;
border-spacing: 0 15px;
}
.tfsjzt-table-wrap .el-table .el-table__body tr td .cell{
height: 52px;
line-height: 52px;
}
.tfsjzt-table-wrap .el-table .el-table__body-wrapper::-webkit-scrollbar {
/滚动条整体样式/
width: 12px;
/高宽分别对应横竖滚动条的尺寸/
height: 1px;
border: none!important;
}

.tfsjzt-table-wrap .el-table .el-table__body-wrapper::-webkit-scrollbar-thumb {
/滚动条里面小方块/
border-radius: 0;
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
background: rgba(0, 192, 255, 1);
}

.tfsjzt-table-wrap .el-table .el-table__body-wrapper::-webkit-scrollbar-track {
/滚动条里面轨道/
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
border-radius: 0;
background: rgba(0, 192, 255, .3);
}

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/IT小白/article/detail/113739
推荐阅读
相关标签
  

闽ICP备14008679号