确认是否有全局或私有CSS样式修改了滚动条的默认行为。特别是检查是否有样式将滚动条隐藏或设置了极小的尺寸,导致滚动条不可见。你可以尝试重置或删除这些样式,看是否能解决问题。 检查列宽设置: 如果el-table或其列设置了固定宽度,且所有列的宽度之和未超过表格容器的宽度,那么横向滚动条可能不会出现。确保列宽之和...
::v-deep .el-table__body-wrapper::-webkit-scrollbar {// width: 20px; /* 纵向滚动条 */height: 8px; /* 横向滚动条 必写 */}/* 设置滚动条样式 */::v-deep .el-table__body-wrapper::-webkit-scrollbar-thumb {设置滚动条哑颜色,根据自己选择设置// background-color: #dde;border-radius...
简介:el-table横向滚动条不显示问题 背景 在Vue中使用el-table,设置表格高度和宽度后,表格内容超出,横向滚动条没有显示。 解决办法 设置滚动条宽度和高度即可。 /* 设置滚动条宽度和高度 *//deep/.el-table__body-wrapper::-webkit-scrollbar{width:8px;/* 横向滚动条 */height:8px;/* 纵向滚动条 必写 ...
方法1、在el-table上手动添加滚动条 1、在el-table上方添加一个div,div的宽度和表格的宽度相同。 <div ref="topScroll" class="top-scroll"> <div class="top-scroll-content" :style="{ width: topScrollWidth }"></div> </div> <el-table ref="tableRef" :data="list" v-loading.body="listLoad...
el-table可以手动调整列宽,当拉得非常宽的时候会出现横向滚动条 1.css设置不显示横向滚动条 /* 表格不出现横向滚动条 */.el-table--scrollable-x.el-table__body-wrapper{overflow-x: hidden; } 2.设置最大列宽,查阅element官网文档,header-dragend事件可以查看修改前后的列宽 ...
el-table不出现滚动条 修改样式的时候,发现没出现自己想要的效果,用div重新布局以后,发现效果是出现了,但el-table滚动条不见了。 解决: <div style="padding:2px;height:600px"> <el-table v-loading="loading":data="list"highlight-current-row
el-table默认会自动显示横向滚动条,我们需要通过CSS来隐藏它。我们可以通过给表格的样式class添加一些CSS样式来实现这个目的。 首先,我们需要给表格的外层容器设置overflow-x: hidden的样式,以隐藏溢出的内容。 .custom-table{overflow-x:hidden;} 1. 2.
问题: 此时,右侧商务标和基数表是动态循环出来的,左侧固定表头常规写法,如果这样写会出现一下问题 表格宽度超出,底部滚动条不会出现,表头显示不全的样式问题 解决方法: 前面固...
问题分析:这是由于固定列遮挡了下方的滚动条,导致滚动条无法响应滚动操作。解决策略:通过调整固定列样式,给固定列添加下边距,设置的下边距大小等同于横向滚动条的高度。这样可以确保滚动条在固定列下方的区域依然可被激活。注意事项:此方法在屏幕分辨率足够大,无需横向滚动条时,会在固定列下方产生一道...