一直是模模糊糊知道个大概,今天有空试验梳理一下~
sticky定位就是在阙值前是相对定位,一旦到阙值就是绝对定位

  1. position:sticky
  2. 父元素不能是overflow:hidden/auto
  3. 必须指定top\left\right\bottom,如果不指定,则处于相对定位
  4. 如果父元素没有滚动框则相对的是viewport,如果有则相对于拥有滚动框的父元素
  5. 父元素高度不能小于sticky元素高度。
    父元素没有滚动框的情况,如图是相对于viewport定位的
    a. 阙值之前
    position stickyb. 阙值之后
    position sticky父元素有滚动框
    a.阙值之前
    position stickyb.阙值之后
    position stickydemo
    position sticky

相关文章: