修复了表格和div中的页眉和页脚？

Question

我有一个可滚动的div窗口内的表。标题包含在thead标记中，页脚位于底部的单独tbody中。我需要将它们固定在屏幕上，同时保持它们的对齐/方向。

我已经尝试了

position:absolute

这会扭曲一切。

请参阅以下小提琴： http://jsfiddle.net/jkgt3wdm/

我对所有建议持开放态度。

编辑：还需要能够向左和向右滚动。

Answer 1

确保您的页脚位于<tfoot>后，您可以使用以下方法修复页眉顶部和底部的标题：

   position:fixed;

然后将标题放在：

   top:0;

和页脚：

   bottom:0;

像这样：

thead, tfoot {position:fixed;background-color:#000; color:#fff;}
thead {top:0; }
tfoot {bottom:0;}

您仍然需要配置<tbody>单元格的宽度，但这应该会为您提供粘性页眉和页脚。

这是你在找什么：http://jsfiddle.net/jkgt3wdm/6/

Answer 2

说实话，最简单的处理方法是使用已经构建的东西。弄表并不总是很容易，如果有人已经找到了一个万无一失的方法，为什么不使用它：）

我建议使用此：https://github.com/jmosbech/StickyTableHeaders

Answer 3

将此视为快速解决方案：

ResultSet

http://jsfiddle.net/jkgt3wdm/7/