在写代码的过程中每天都在用到position这个属性，但是当被问到他们的类型有什么区别的时候，却讲不清楚，今天就梳理一下。

static

这个很好理解，是默认值，没有定位，元素正常出现在文档流中。

fixed（脱离文档流）

这个也很好理解，生成绝对定位元素，元素相对浏览器窗口进行定位。

relative

生成相对定位元素，top、left、right、bottom相对元素原来的位置进行定位，但是占据的空间是未偏移之前占据的空间。

absolute

生成相对定位元素，其相对定位的参照是最近的定位不是static的父元素进行定位。

sticky

sticky是position: relative和position: fixed的结合体——当在屏幕内的时候，表现为relative，当将要移出屏幕的时候，表现为fixed。

sticky.gif

但是要实现这个粘滞效果，要注意一下几点：

1、直接父元素不能设置固定高度；
2、父元素的overflow必须是visible；