Question

我有一个HTML表格，我想在第一行固定的同时滚动，我能够制作固定的标题行，但我也希望我的第一行也可以保持固定。已经过去了两天，我正在尝试'没有成功。那里有人遇到过这种问题吗？

<table>
   <thead>
      <tr>
         <th>Header 1</th><th>Header 2</th> // this i have fixed already
      </tr>
   </thead>
   <tbody>
      <tr>....</tr> // this row i want to make fixed while i scroll.
      <tr>....</tr>
   </tbody>
</table>

JSFiddle直到现在我从网上得到了这个

Answer 1

表可以有多个tbody元素，因此您可以将此固定行添加到第一个tbody，并将行重新添加到第二个tbody。然后就是用css进行一些游戏来设置它。

工作演示：http://jsfiddle.net/sMMZ9/4/

演示基于this solution

Answer 2

这是怎么回事：

.scrollContent > tr:first-child{
    position: fixed;
}

Answer 3

您需要在<thead>元素中插入第一行并应用与您应用的元素相同的css： -

<thead class="fixedHeader">
    <tr class="alternateRow">
        <th><a href="#">Header 1</a></th>
        <th><a href="#">Header 2</a></th>
        <th><a href="#">Header 3</a></th>
    </tr>
    <tr class="normalRow">
        <td>Cell Content 1</td>
        <td>Cell Content 2</td>
        <td>Cell Content 3</td>
    </tr>
</thead>

的 CSS 的

html > body thead.fixedHeader td { width: 200px; }

您还可以根据自己的设计添加边框。希望它能为您提供帮助。

Answer 4

看到这个链接
https://github.com/cheald/floatingFixed
它有一个jquery插件，可能就是你想要的。

使一行表固定

4 个答案: