前端中的几个position

最近一只大四狗在准备面试，所以整理一波概念。

static：无特殊定位，对象遵照HTML的定位规则

absolute ：将对象从文档流中拖出，使用 left ， right ， top ， bottom 等属性，相对根元素进行绝对定位（其根元素可以自己设定，如果其父元素设置为relative,那么根元素就是其父元素，如果其爷爷元素设置为relative，那根元素就是其爷爷元素，以此类推；如果都没有设置relative,那么其根元素就是其祖先节点）。而其层叠通过 css z-index 属性定义，默认覆盖在非定位元素之上。此时对象不具有边距，但仍有补白和边框 。

relative：对象不可层叠，但将依据left，right，top，bottom等属性在正常文档流中偏移位置

fixed：脱离文档流，根据left，right，top，bottom等属性相对根元素进行绝对定位，但是其根元素固定为浏览器窗口。页面滑动时，元素相对浏览器的位置不动

此外：absolute和fixed都会强制试元素的display：inline-block，哪怕显示设定元素display:inline/block都无效