el-table 组件是支持横向滚动条的。当表格列的总宽度超过表格容器的宽度时,就会出现横向滚动条。 在el-table组件中添加必要的属性以启用横向滚动条: 通常不需要额外的属性来启用横向滚动条,只需要确保表格内容宽度超过容器宽度即可。不过,你可以通过 style 属性或外部 CSS 来控制表格容器的宽度。下面...
方法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__fixed样式。 效果:就是设置bottom值,使得不盖住滚动条。 缺点:不适用与含有合计的table,如果含有合计,合计也会上移。 /* 给固定列设置下边距 */.el-table.el-table__fixed{height:auto!important;bottom:17px!important;/* 具体值是多少根据你横向滚动条的高度进行设置 */}/* 去...
el-table可以手动调整列宽,当拉得非常宽的时候会出现横向滚动条 1.css设置不显示横向滚动条 /* 表格不出现横向滚动条 */.el-table--scrollable-x.el-table__body-wrapper{overflow-x: hidden; } 2.设置最大列宽,查阅element官网文档,header-dragend事件可以查看修改前后的列宽 ...
解决方法:改变固定列的样式,给固定列设置下边距,下边距的大小等于横向滚定条的高度 注意:这样改样式如果屏幕分辨率足够大无横向滚动条时,固定列下方就会多出一道横线,不美观,可以用样式去除 样式代码如下: //给固定列设置下边距.el-table{.el-table__fixed{height:auto!important;bottom:8px!important;//具体值是...
Bug Type: Component Environment Vue Version: 3.5.10 Element Plus Version: 2.9.0 Browser / OS: Chrome 131.0.6778.140 Build Tool: Vite Reproduction Related Component el-table Reproduction Link Element Plus Playground Steps to reproduce 点一下...
直接调试css就行了呗