我可以只通过 CSS 来制作没有 jquery 的表头吗？ [复制]

Posted 2023-03-06

【中文标题】我可以只通过 CSS 来制作没有 jquery 的表头吗？ [复制]

【英文标题】：Can I make header of a table fixed without jquery, only by CSS? [duplicate]

【发布时间】：2014-06-13 04:43:47

【问题描述】：

有没有一种方法可以在不使用任何 javascript 的情况下仅使用 CSS 来修复表头？

【问题讨论】：

这个question is asking for a non-javascript version。这个page shows different approaches。这个question is asking for html5 css only approach

【参考方案1】：

怎么样：

CSS：

thead 
position: fixed;

HTML：

<table>
<thead></thead>
<tbody>
<tr>
<td>
</td>
</tr>
</tbody>
</table>

现在，任何名为<thead> 的标签都将被自动修复。如果您只想修复特定标签，请尝试：

CSS：

.tofix 
position:fixed;

HTML：

 <table>
    <thead class="tofix"></thead>
    <tbody>
    <tr>
    <td>
    </td>
    </tr>
    </tbody>
    </table>

然后任何带有类名的标签都将被修复。附带说明：在 CSS 中执行 thead.tofix 将使只有 <thead> 标记可以具有该类。

【讨论】：

这不能按预期工作。