认识position：fixed/absolute/relative

1.position: relative

相对定位，不脱离文档流，参考自身静态位置通过 top,bottom,left,right 定位，并且可以通过z-index进行层次分级。

2.position:static

正常流（默认值），不能通过z-index进行层次分级。(设置left等无效)

3.position:absolute

绝对定位，脱离文档流的布局，子元素脱离文档流，可导致父元素无法被撑开，遗留下来的空间由后面的元素填充。通过 top,bottom,left,right 定位，定位的起始位置为最近的父元素(postion不为static)，否则为Body，可以通过z-index进行层次分级。在拖拽页面滚动条时，该元素随其一起滚动。

4.position: fixed

固定定位，脱离文档流，相对于浏览器窗口进行定位，在拖拽页面滚动条时，该元素不会随其一起滚动，可以通过z-index进行层次分级。

5.position: sticky

粘性定位的元素是依赖于用户的滚动，在 position:relative 与 position:fixed 定位之间切换。
它的行为就像 position:relative; 而当页面滚动超出目标区域时，它的表现就像 position:fixed;，它会固定在目标位置。
元素定位表现为在跨越特定阈值前为相对定位，之后为固定定位。