修复了滚动 table 时 table 内的 header

Fixed header within table when scrolling the table

问题:

我有一个 table 太大,不能作为移动设备的液体样式元素。我的解决方案是制作 overflow-x: auto。效果很好,几乎就是电子表格在移动应用程序上的工作方式。一个问题是,table 与 offset-y 部分中的 header 可能会混淆阅读。有时我发现自己向上滚动只是为了查看我正在查看的数据列。

问题:

有没有办法使用 CSS/JS - jQuery 将 table header 保持在 table 本身内的固定位置,以便在用户滚动数据时,header 总是像您期望的那样显示在移动应用程序中? (mac 的数字也这样做)。我不介意使用 CSS3,因为它适用于移动设备。

具有相同行为的其他事物

我只是想确保你们知道我在说什么,因为我找不到与我想做的事情相似的东西。不确定我是否输入了错误的搜索词或什么。但它几乎是 floatfixed 之间的混合风格。

这就是您要查找的内容:https://css-tricks.com/persistent-headers/

以前做过很多次

Code drops 有一篇关于在滚动时修复 table headers 的优秀文章。

该解决方案基于 JQuery,适用于行标题和列标题

Sticky Table Headers & Columns