如图所示，如何避免表格可滚动内容在后面可见？答案

【问题标题】：How to avoid table scrollable contents from being visible behind as shown in the pic?如图所示，如何避免表格可滚动内容在后面可见？
【发布时间】：2021-05-06 14:48:21
【问题描述】：

我试图通过固定高度和溢出来使 tbody 可滚动，但是当我滚动时，tbody 的内容与表格重叠，如图所示。我错过了什么？任何帮助都会很有用。提前致谢。

【问题讨论】：

你能展示你的css吗？您在父 div 元素上设置了固定高度和溢出，而不是在表格的 tbody 上。
@MaksimL 我尝试将相同的内容添加到 tbody 但它似乎不起作用。因此我将它添加到父 div。它在那里工作，但是在将 th 设为静态后，当我滚动 tbody 时，它会在背景中溢出，如图所示。我想避免这种情况。

标签： html css html-table styles

【解决方案1】：

.card-body          { overflow-y: auto; height: 440px; } 
.card-body thead th { position: sticky; top: 0; }

【讨论】：

【解决方案2】：

我想出了另一种方法。我删除了 .card-body 的填充，而是使用了边距。现在内容不会溢出。

.card-body {padding:0px;margin:15px;}

【讨论】：