CSS overflow 问题：使一个 div 中的内容能跟着别的 div 中内容向左右滑动，但不跟着上下滑动

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

Can I use?

› http://caniuse.com/

Less

› http://lesscss.org

Cool Libraries

› Bootstrap from Twitter

› Jetstrap

这是一个创建于 1543 天前的主题，其中的信息可能已经有所发展或是发生改变。

比如表格中，head 很长，会跟着 tbody 左右移动，但不希望它跟着 tbody 上下移动而是固定在原来的位置真诚提问，每个回答都会感谢！

7 条回复 • 2020-08-31 22:01:40 +08:00

iNaru

2020-08-31 00:56:39 +08:00

position: sticky;

kkll7766

2020-08-31 03:21:19 +08:00

@kkll7766 设置了
position: -webkit-sticky;
position: sticky;
top: 20px;
但是没有反应

kkll7766

2020-08-31 03:39:13 +08:00

parent 已经设置了 overflow, child 的 position sticky 就无效了

alvinbone88

2020-08-31 08:04:29 +08:00 via Android

原生的滚动就这样，一个方向设置为 scroll，另一个方向也会设置为 scroll 。不想要这样的效果可以用 js 模拟滚动，相关的库很多

liyang5945

2020-08-31 09:14:17 +08:00

这个我前几天弄过，一个固定表头的表格，也是使用 position: sticky 实现的，可以看看我的写的这篇文章： https://liyangzone.com/2020/08/15/前端 /draggable-fixed-header-table/

liyang5945

2020-08-31 09:16:17 +08:00

kkll7766

2020-08-31 22:01:40 +08:00

@liyang5945 @iNaru @alvinbone88 感谢大家！解决了。要点是在 th 上设置 position: sticky