Question

我在Angular 2中有一个具有千位记录表的应用程序。当我向下滚动时，我想要修复我的标题。我怎样才能达到相同的目标？

我尝试将Head设置为固定并设置Column的Max-width，但它们都没有工作。 P.S-因为它是一个Angular应用程序，我想尽可能地避免使用JQuery。

提前致谢。

Answer 1

您只需使用position: fixed;作为标题即可。你也可以使用bootstrap Affix插件。

Answer 2

这是你的表格格式

<table>
<thead>
   <th>fname</th>
   <th>lname</th>
</thead>
<tbody>
<tr>
   <td>john</td><td>doe</td>
</tr>
<tr>
   <td>john</td><td>doe</td>
</tr>
<tr>
   <td>john</td><td>doe</td>
</tr>

</tbody> 
</table>

这是该表的css

table tbody, table thead
{
    display: block;
    border:1px solid red;
}

table tbody 
{
    overflow: auto;
    height: 100px;
}

th , td
{
    width: 50px;
}

此处https://jsfiddle.net/mf6hg9jq/2/

将标题修复保留在响应式可滚动表中

2 个答案: