element-UI el-table样式(去边框和滚动条样式)
去边框:
给el-table绑定class=“customer-table”
.customer-table th { border: none; } .customer-table td, .customer-table th.is-leaf { border: none; } .el-table--border, .el-table--group { border: none; } .customer-table thead tr th.is-leaf { border-right: none; } .customer-table thead tr th:nth-last-of-type(2) { } .el-table--border::after, .el-table--group::after { width: 0; } .customer-table::before { width: 0; } .customer-table .el-table__fixed-right::before, .el-table__fixed::before { width: 0; } .el-table--border th.gutter:last-of-type { border-left: none; }
效果:
滚动条样式:
全局el-table
*::-webkit-scrollbar {
width: 4px;
height: 10px;
background-color: transparent;
} /*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/
*::-webkit-scrollbar-track {
background-color: #8db4fd;
border-radius: 2px;
} /*定义滚动条轨道 内阴影+圆角*/
*::-webkit-scrollbar-thumb {
background-color: #1a3f81;
border-radius: 2px;
} /*定义滑块 内阴影+圆角*/
.scrollbarHide::-webkit-scrollbar {
display: none;
}
.scrollbarShow::-webkit-scrollbar {
display: block;
}
效果: