滚动 HTML 嵌套表答案

【问题标题】：Scrolling HTML Nested Tables滚动 HTML 嵌套表
【发布时间】：2011-07-10 04:34:35
【问题描述】：

如果给定最大高度，如何使包含子/嵌套表的表可滚动？我不希望标题随之滚动。我真正在寻找的是一些可以将我的 s 包装在其中的有效标签，或者其他一些与 this 一样有效的标记：

    <table>
    <thead>
        <tr>
            <th>Column1</th>
            <th>Column2</th>
        </tr>
    </thead>
    <!-- Insert valid tag here to wrap <tbody>s -->
    <tbody>
        <tr>
            <td>Val1</td>
            <td>Val2</td>
        </tr>
        <tr class="sub-table">
            <td colspan="2">
                <table>
                    <thead>
                        <tr>
                            <th>Sub Column1</th>
                            <th>Sub Column2</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>Sub Val1</td>
                            <td>Sub Val2</td>
                        </tr>
                    </tbody>
                </table>
            </td>
        </tr>
    </tbody>
    <tbody>
        <tr>
            <td>Val1</td>
            <td>Val2</td>
        </tr>
        <tr class="sub-table">
            <td colspan="2">
                <table>
                    <thead>
                        <tr>
                            <th>Sub Column1</th>
                            <th>Sub Column2</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>Sub Val1</td>
                            <td>Sub Val2</td>
                        </tr>
                    </tbody>
                </table>
            </td>
        </tr>
    </tbody>
    <!-- Insert valid close tag here -->
</table>

【问题讨论】：

您是希望嵌套表的 TBODY 滚动，但嵌套表的 THEAD 保持固定，还是应该只有主表的 THEAD 保持固定？

标签： html html-table nested

【解决方案1】：

如果我正确理解您的问题，也许可以试试这样：http://jsfiddle.net/pPuXL/1/

您需要将 TBODY 元素显示为“块”或“内联块”，以便溢出对其进行处理，如我发布的 CSS 示例中所示。

【讨论】：