共计 611 个字符，预计需要花费 2 分钟才能阅读完成。
我不是最后一个知道的：position: sticky
position 的含义是指定位类型，取值类型可以有：static、relative、absolute、fixed、inherit 和 sticky，这里 sticky 是 CSS3 新发布的一个属性。
关于这里只讲述 sticky 的用法，关于 sticky：
设置了 position: sticky 的元素并不脱离文档流，仍然保留元素原本在文档流中的位置。
当元素在容器中被滚动超过指定的偏移值时，元素在容器内固定在指定位置。亦即如果你设置了 top: 50px，那么在 sticky 元素到达距离相对定位的元素顶部 50px 的位置时固定，不再向上移动（相当于此时 fixed 定位）。
元素固定的相对偏移是相对于离它最近的具有滚动框的祖先元素，如果祖先元素都不可以滚动，那么是相对于 viewport 来计算元素的偏移量。
在 web 开发中注意兼容性：
sticky 目前仍是一个试验性的属性，并不是 W3C 推荐的标准。它之所以会出现，也是因为监听 scroll 事件来实现粘性布局使浏览器进入慢滚动的模式，这与浏览器想要通过硬件加速来提升滚动的体验是相悖的。具体情况可以看下图，基本上可以说这个属性使用的浏览器只有 FireFox 和 iOS 的 Safari
小程序自定义导航栏中使用 sticky:
sticky 是可以再小程序端生效的！亲测这个属性在自定义导航时特别适用，我也是在纠结自定义导航的 fixed 适配占位问题时才了解到这个属性。
正文完
