场景设定：当表格列数过多时，添加固定列功能，将序号和名称列锁定在左侧，操作列锁定在右侧，此时会自动出现横向滚动条以供浏览非固定列信息。问题描述：然而，问题在于横向滚动条在固定列的下方位置无法使用。滚动条只能在非固定列部分下方操作，无法触及固定列区域。问题分析：这是由于固定列遮挡了下方的...
当我们使用element table,有时我们需要部分的列固定,我们就给列添加了 fxied属性,但是这时候你会发现table的横向滚动条很难拖动,查找原因你会发现原来是固定的列把滚动条给挡住了,只有超出固定的部分滚动条才可以拖动。 解决办法 法一: 做法:修改el-table__fixed样式。 效果:就是设置bottom值,使得不盖住滚动条。
方法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{.el-table_...
我使用的滚动条样式宽高都是5px,和下方css中的一致 解决办法: 初始版解决了之后会出现一个问题就是如果没有滚动条,则左侧固定列还会和下方边线有间隙,右侧也是如此,所以又进行了对滚动条下固定列样式的修改 初始版: 右侧间隙样式: .el-table__fixed-right { ...
1.在el-table的一些列加fixed后,固定列的横向滚动条无法拖动问题: (1)加样式 1-1 如果有合计行的,适当增加bottom的值 (2)加上样式后,因为固定列有bottom: 17px的距离,会导致不固定列的滚动到底部后,与左侧发生错位 1-2 这时需加上: 1-3 2.有纵向滚动条,在横向拖到最右侧时,导致表格位置错乱 ...
1、在对应的vue文件里,先设置最外层的大div的class名为 admin_wrapper 2、在需要改变的vue文件里,书写局部样式 注意这里,项目支持啥样式就对应些啥(我的项目里配置支持了scss的写法) <style lang='scss' scoped> .admin_table /deep/ .el-table__fixed{height:auto!important;bottom:16px;}// 这个作用是提...
ElementUI中el-table设置指定列固定不动,不受滚动条影响,场景使用el-table显示人员信息时,如果要显示的人员信息列比较多,就会出现滚定条。如果希望前面指定的像工号abel="姓名"al...
} .el-table.hide-scrollBar{ /*隐藏滚动条 设置底部padding20px*/ scrollbar-width: none; /* Firefox */ -ms-overflow-style: none; /* IE 10+ */ padding-bottom: 20px; } .el-table.hide-scrollBar ::-webkit-scrollbar { display: none; /* Chrome Safari */ } </style> <!--tableDemo...
1. 设置表格的宽度 可以通过给表格添加style属性来设置表格的宽度,例如: <el-table :data="tableData" style="width: 800px"> // 表格列配置 </el-table> 通过设置表格的宽度,可以让表格在超出容器宽度时出现横向滚动条。 2. 固定表头 通过设置表格的固定表头属性,可以让表头固定在表格顶部,表格内容部分出现...