关于html的position定位问题

参考文档：MDN

relative

当元素被设置为relative属性后，相对于该元素的原位置进行定位。

该元素的原空间得以保留。

该元素的新位置不影响其他元素；

元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定.

absolute

当元素被设置为absolute属性后，相对于使用了relative,fixed,absolute其中之一属性的第一个父元素定位，直到浏览器窗口。

该元素的原空间不会保留。

该元素的新位置不影响其他元素。

由于css层叠样式的特点，如果后渲染的元素通过absolute定位跟前一absolute定位元素有重叠，后渲染的元素会覆盖前渲染的元素。

元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。

static

默认值

fixed

相对于窗口位置绝对定位，位置不随页面滚动改变

元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。