Skip to main content

relative、absolute 、fixed 、sticky 和 static 元素的区别?

  • static:是普通流中的元素,无定位。
  • relative:相对于自己原本的位置定位,未脱离普通流。
  • absolute:相对于 static 定位以外的第一个父元素进行定位,脱离普通流。
  • fixed:相对于浏览器窗口定位,生成固定定位的元素,脱离普通流。
  • sticky:很像 relative 和 fixed 的结合,该定位基于用户滚动的位置。 默认为 relative,而当页面滚动超出目标区域时,它的表现就像 fixed,它会固定在目标位置。脱离普通流。

参考文章

http://www.ruanyifeng.com/blog/2019/11/css-position.html