elementUI的table出现滚动条时会多处一列白色块

作者：System 时间：2024年08月17日分类：所有,html5 字数：727

这篇文章距离上次修改已过256天，其中的内容可能已经有所变动。

这个问题可能是由于Element UI的Table组件在计算滚动条宽度时出现了一些不一致，导致多出的白色块出现。

解决方法：

确保Element UI的版本是最新的，如果不是，请更新到最新版本。
检查是否有全局样式覆盖了Element UI的样式，如果有，请确保你的样式优先级足够高，可以使用更具体的CSS选择器或使用!important。
如果上述方法不奏效，可以尝试在你的Vue组件中重新计算或者调整Table的布局，确保滚动条的引入不会影响布局。
作为临时解决方案，可以在CSS中添加一些样式规则来隐藏或调整白色块的样式：

/* 隐藏多余的列 */
.el-table__body-wrapper::-webkit-scrollbar {
  width: 10px; /* 根据需要调整 */
}

/* 调整滚动条的样式 */
.el-table__body-wrapper::-webkit-scrollbar-track {
  background-color: #f9f9f9; /* 根据需要调整背景色 */
}

.el-table__body-wrapper::-webkit-scrollbar-thumb {
  background-color: #dcdfe6; /* 根据需要调整滚动条颜色 */
  border-radius: 5px; /* 根据需要调整圆角 */
}

请注意，这些样式规则是针对Webkit内核浏览器的。如果你需要考虑其他浏览器兼容性，可能需要添加额外的CSS规则来处理不同浏览器的滚动条样式。

elementUI的table出现滚动条时会多处一列白色块

评论已关闭

推荐阅读