参考链接

position

position: static;

static 是 position 属性的默认值。

注意，static定位所导致的元素位置，是浏览器自主决定的，

所以这时 top、bottom、left、right 、 z-index 这五个属性无效。

position: relative;

相对于默认位置（即**static**时的位置）进行偏移，即定位基点是元素的默认位置。

用了相对定位的元素仍然在标准文档流中，原来的位置会被保留，不影响其他元素的偏移。

注：水平和垂直方向只需要各使用一个具体方向即可。

left，top 优先级高于 bottom，right，即同时设置时，**left** 与 **top** 生效。

position: absolute;

绝对定位元素相对于最近的非 **static** 祖先元素定位，即最近的存在定位的父元素。

当这样的祖先元素不存在时，则相对于整个网页的根元素 **html** 定位。

绝对定位的元素不在标准文档流中，原来的位置不会被保留。

即在”标准文档流”中，该元素所占空间为零，周边元素不受影响。

注：若元素未指定高度和宽度，则可能会占满屏幕

position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: 0;

position: fixed;

固定定位相对于视口（viewport，浏览器窗口）进行偏移，即定位基点是浏览器窗口。

这会导致元素的位置不随页面滚动而变化，好像固定在网页上一样。

固定定位的元素不在标准文档流中，原来的位置不会被保留。

position: sticky;

粘性定位可以被认为是相对定位和固定定位的混合。元素在跨越特定阈值前为相对定位，之后为固定定位。

须指定 **top**，**right**， **bottom** 或 **left** 四个阈值其中之一，才可使粘性定位生效。否则其行为与相对定位相同。

用了粘性定位的元素仍然在标准文档流中，原来的位置会被保留，不影响其他元素的偏移。

注：粘性定位的元素不会超出直接父元素。