修复表格标题并使表格主体在 React 中滚动

Posted 2023-03-06

【中文标题】修复表格标题并使表格主体在 React 中滚动

【英文标题】：Fixing table header and making the table body scroll in React

【发布时间】：2021-05-04 11:15:42

【问题描述】：

Here 是一个代码沙箱 URL，其中包含一个表格组件的 React 代码，

我想让这个组件中的标题固定在顶部，并且表格主体可以滚动。为此，我找到了答案here。但是，如果我将tbody 设置为display: block 并将thead 设置为display: table 并按照上述答案中的建议进行更改，那么我的表头列将与我的tbody 列不对齐，如附在截图在这里。

我想让标题固定在顶部，而正文的内容应该是可滚动的并且不应该干扰对齐。我怎样才能实现它？有人可以帮忙吗。提前非常感谢。

【参考方案1】：

这里有更多关于它的信息。 :) 不客气。

https://css-tricks.com/position-sticky-and-table-headers/