CSS：在包含多个 <tbody> 标签的表中实现固定标题滚动？答案

【问题标题】：CSS: Implementing Fixed Header scroll in a Table that contains multiple <tbody> tags?CSS：在包含多个 <tbody> 标签的表中实现固定标题滚动？
【发布时间】：2016-02-06 19:04:02
【问题描述】：

这是我的表结构：

                <table>
                        <thead >
                            <tr>
                                <th >Header 1</th>
                                <th >Header 1</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td>Cell</td>
                                <td>Cell</td>
                            </tr>
                        </tbody>
                            <tbody>
                            <tr>
                                <td>Cell</td>
                                <td>Cell</td>
                            </tr>
                        </tbody>
                </table>

我有多个 tbody 标签来支持具有跨行的嵌套 ng-repeat 结构，因此不可避免地会有 tbody 标签。但是，我现在无法将这些 tbody 标记放入有效容器中并将溢出-y 设置为自动，以便仅为表数据引入滚动条，而不包括标题（标题）

我们将不胜感激！

【问题讨论】：

将您的标题固定在顶部，或使用 2 个不同的表格固定：第一个带有标题，第二个 - 带有数据
两张表是最简单的解决方案，但是两张表之间的列宽对齐问题非常大

标签： javascript html css angularjs

【解决方案1】：

首先要考虑多个 tbody。您可以在不使用多个 tbody 的情况下完成任务，因为这不是一个好方法。

除此之外，您还可以使用Table FloadHead 插件。它可能有助于修复标题。

【讨论】：