:在HTML / CSS中滚动时如何显示

前端之家收集整理的这篇文章主要介绍了:在HTML / CSS中滚动时如何显示前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个大约300行12列的大桌子.通过在页面翻页来滚动表格时,< thead>默认情况下不显示内容.我想在滚动“内部”< tbody>时看到它.也就是说,如果屏幕顶部以一行开头,我希望首先显示标题.否则它应该像常规表一样.

到目前为止我看到的常见解决方案是创建一个可以自行滚动的表(因此与页面滚动无关).也就是说,answers to this question建议.

但是如果跨越屏幕有很多列,这不是很实用,特别是因为现在有两个独立的滚动条.在移动设备上,第二个滚动条带走了大量宝贵空间.而且使用它也很烦人.你不能简单地“翻身”,但你必须集中精力去击中那个小小的滚动条.在其他浏览器上,你可以滚动触摸其中的数据,但一旦你移出外面,另一个恼人的运动发生……

有一个干净的CSS方式来做到这一点?

解决方法

希望这个位置:粘性有一天会成为这个问题的最终答案(见 announcement here),如上面的评论所述,我仍然着迷于制作一个简单的HTML / CSS概念验证,没有双滚动条.

我的简单解决方案 – 不是一个完美的解决方案,更像是一个练习 – 没有脚本:

>复制thead,一个滚动页面,一个保持固定
>使用z-index来显示相应的thead

http://jsfiddle.net/willemvb/hEyZh/

猜你在找的HTML相关文章