elementpluseltable的间隙

Question

这种elementplus eltable 表格与表格之间的间隙怎么去掉，因为悬浮的时候很难看,

Answer 1

阿里嘎多学长整理AIGC生成，因移动端显示问题导致当前答案未能完全显示，请使用PC端查看更加详细的解答过程

Element Plus el-table 间隙解决方案

你遇到的问题是 Element Plus 的 el-table 表格与表格之间的间隙太大，导致悬浮时不美观。

解决方案是使用 table-layout 属性来设置表格的布局方式。可以将其设置为 fixed，这样可以使表格的间隙减少。

例如：

<el-table :data="tableData" style="table-layout: fixed;">
  <!-- 表格内容 -->
</el-table>

另外，你也可以使用 border-collapse 属性来设置表格的边框-collapse，来减少间隙。

<el-table :data="tableData" border-collapse="collapse">
  <!-- 表格内容 -->
</el-table>

这两个方法可以单独使用，也可以组合使用以达到更好的效果。

如果你想完全去掉间隙，可以使用 margin 和 padding 属性来设置表格的外边距和内边距为 0。

<el-table :data="tableData" style="margin: 0; padding: 0;">
  <!-- 表格内容 -->
</el-table>

希望这些解决方案能够帮助你解决问题！