position: sticky;

Avatar of Chris Coyier
Chris Coyier

DigitalOcean 为您旅程的每个阶段提供云产品。 立即开始使用 200 美元的免费额度!

更好的 position: sticky; 支持即将 到来。 WebKit 在 2013 年推出,Firefox 在 2014 年推出,Blink 在(大概)2016 年推出。

MDN 对其进行了很好的解释

粘性定位是相对定位和固定定位的混合。 元素被视为相对定位,直到它越过指定的阈值,此时它被视为固定定位。

Šime Vidas 在最近的 Open Web Platform Daily Digest 中指出了这一点,并将 MDN 的演示移植过来,很好地展示了它的实用性

查看 Šime Vidas 在 CodePen 上的钢笔 Sticky positioning (@simevidas)。

正如您在该演示中看到的,它是渐进增强的一个不错的候选方案,如果您没有看到粘性标题功能,那也没关系。