关于el-table配置不展示滚动条的问题,可以从以下几个方面进行排查和解决:1. 检查el-table的CSS样式 确保没有CSS样式直接隐藏了滚动条。这包括检查是否有全局CSS或特定组件CSS设置了overflow: hidden、scrollbar-width: none等可能隐藏滚动条的属性。可以通过浏览器的开发者工具(通常按F12打开)来查看和修改这些样式。
现在需求是右侧滚动条不好看,需要去除滚动条,并隐藏滚动条所占列的位置 // ---修改elementui表格的默认样式---.el-table__body-wrapper{ &::-webkit-scrollbar { // 整个滚动条width:0; // 纵向滚动条的宽度background:rgba(213,215,220,0.3);border: none; } &::-webkit-scrollbar-track { // 滚...
因为表格的列数多,所以table必然会出现横向滚动条。当行数过多时,出现纵向滚动条,操作时,就需要先滚动到表格底部,然后进行左右的拉动,这样是用户操作很不方便。 应对方案 当数据过多,table的X轴滚动条不在可视区域时,给table的父级容器添加一个滚动条perfectScrollbar,然后将perfectScrollbar的scroll值赋值给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...
检查你的纵向滚动条是否是表格内容的滚动条:具体验证方法是固定表头,然后滚动纵向滚动条。 如果滚动时表头不动,那么滚动条是正确的。滚动条正确后,使用正确滚动条滚动,固定列只有下方没有对齐,但可以滚动出来,此时修改对齐方法如下: /deep/ .el-table__fixed{ ...
一、了解el-table纵向滚动轴样式的默认样式 在开始我们的定制之前,首先需要了解el-table纵向滚动轴的默认样式。el-table的默认纵向滚动轴样式通常是一个简单的滚动条,样式相对简约。如果你对这种简单的滚动条样式不感兴趣,那么我们就需要进行一些定制。 二、使用CSS定制el-table纵向滚动轴样式 我们可以使用CSS来对el-...
1. 设置iframe scrolling="no" 横向纵向滚动条都隐藏了 2. 被包含页body应用overflow:hidden 无效 3. 被包含页的body标签加scroll="no" 同1 最终是通过设置body的宽度解决的隐藏横向滚动条,但不隐藏纵向滚动条的 <body style=" margin:0; padding:0; width:670px;"> ...
简介:el-table横向滚动条不显示问题 背景 在Vue中使用el-table,设置表格高度和宽度后,表格内容超出,横向滚动条没有显示。 解决办法 设置滚动条宽度和高度即可。 /* 设置滚动条宽度和高度 *//deep/.el-table__body-wrapper::-webkit-scrollbar{width:8px;/* 横向滚动条 */height:8px;/* 纵向滚动条 必写 ...
3. 当数据量较大时,流体高度可能导致表格内容过长,需要使用滚动条来显示全部内容。 4. el-table的流体高度只适用于表格的纵向高度,横向宽度不受影响。 三、el-table流体高度的优势 相比于固定高度的表格,使用el-table的流体高度具有以下优势: 1. 自适应屏幕尺寸:流体高度可以根据不同的屏幕尺寸自动调整,使表格在...