position的五种方式

任何元素都可以定位，不过绝对或固定元素会生成一个块级框，而不论该元素本身是什么类型。

大多数情况下，height和width 被设定为auto的绝对定位元素，按其内容大小调整尺寸。但是，被绝对定位的元素可以通过指定top和bottom ，保留height未指定（即auto），来填充可用的垂直空间。它们同样可以通过指定left 和 right并将width 指定为auto来填充可用的水平空间。

除了刚刚描述的情况（绝对定位元素填充可用空间）：

• 如果top和bottom都被指定（技术上，而不是auto），top 胜出。
• 如果指定了left 和right两侧，则在direction为ltr（英语，水平日语等）时left 赢，并且在direction为rtl时right赢（阿拉伯文，希伯来文等）。

static：

• 默认值
• 在文档流中
• 忽略 top, bottom, left, right 或者 z-index 声明

relative：

• 在文档流中
• 相对于其正常位置进行定位

absolute：

• 脱离文档流
• 相对于static定位以外的第一个父元素进行定位，若没找到这样的父元素，则相对与初始包含块（包含HTML元素的矩形）定位
• 相对于边框内部进行定位
• 绝对定位元素填充可用空间

fixed

• 脱离文档流
• 相对于浏览器窗口进行定位

sticky

实验性质的API，生产环境尽量别使用