HTML电子表格固定标题和最左边的列

时间:2011-10-01 06:29:28

标签: html css tabular

我正在尝试创建一个类似于Google文档电子表格或Excel的电子表格,其中包含一个充满数据的表格。当我垂直滚动,第一行保持固定,当用户水平滚动时,第一列是否保持固定状态?我不是在寻找插件,这是如何使用HTML / CSS完成的?我一直在查看Google Docs电子表格的代码,但我无法确定解决方案。有人可以为此提供一个简单的例子吗?

例如:

jsFiddle:http://jsfiddle.net/tYUwd/2/

在jsFiddle中,当你水平滚动时,我希望修复.row-header个元素。当您垂直滚动时,.column-headers将被修复。

1 个答案:

答案 0 :(得分:2)

我很确定目前无法使用HTML / CSS。您可以使用HTMl / CSS执行固定标头或伪固定第一列,但是您需要使用JavaScript才能使两者协同工作。我建议您查看此网站:http://www.8164.org/the-big-table-issue/

我还建议查看以下两种可能的解决方案: http://cross-browser.com/x/examples/xtable.php http://www.disconova.com/open_source/files/freezepanes.htm

之前我使用过Freeze Panes解决方案,效果很好。