position: sticky 如何工作，适用于哪些场景

Issue 欢迎在 Gtihub Issue 中回答此问题: Issue 337

Author 回答者: shfshanyue

position: sticky 可理解为 relative 与 fixed 的结合体

Author 回答者: CsongL

MDN的解释：position: sticky 在正常文档流中仍然保有位置，然后会相对于它的最近的滚动祖先和最近的块级祖先根据 top, left, right, bottom 的值进行偏移。元素偏移不会影响其他任何元素的位置，因为会为该元素创建一个新的层叠上下文，从而不会影响到页面上的其他元素

css-tricks一篇文章的理解：在窗口的管轮向下滚动没有让该元素完全消失前，该元素的表现就与postion:relative的元素相同，之后该元素的表现就类似于position: fixed 的元素， 只不过该元素是相对于离他最近的滚轮祖先

Reference: Docs: https://developer.mozilla.org/zh-CN/docs/Web/CSS/position Code: https://css-tricks.com/almanac/properties/p/position/