改变el-table/el-scrollbar滚动轴的颜色及(横纵向)宽度

275 阅读1分钟

在表格中如果全局样式引入的话: .el-table { .el-scrollbar__thumb { background: #09a6ff !important; }

.el-scrollbar__bar.is-horizontal {
    height: 12px !important;
}

.el-scrollbar__bar.is-vertical {
    width: 12px !important;
}

}

如果单个页面样式的话: (vue2) ::v-deep .el-table { .el-scrollbar__thumb { background: #09a6ff !important; }

.el-scrollbar__bar.is-horizontal {
    height: 12px !important;
}

.el-scrollbar__bar.is-vertical {
    width: 12px !important;
}

} (vue3) :deep(.el-table) { .el-scrollbar__thumb { background: #09a6ff !important; }

.el-scrollbar__bar.is-horizontal {
    height: 12px !important;
}

.el-scrollbar__bar.is-vertical {
    width: 12px !important;
}

}

单独使用el-scrollbar改变样式的话,直接去掉外层的el-table即可: :deep(.el-scrollbar__bar.is-horizontal) { height: 12px; }

:deep(.el-scrollbar__bar.is-vertical) { width: 12px; }