定位总结
目前在 CSS 中共有五种定位方案
static
静态定位是 HTML 元素的默认值，即标准文档流
在标准流中，块级元素独占一行，行内元素共享一行
静态定位的元素不会受到 top、bottom、left、right 的影响
relative
相对定位，就是相对自己原来应该处于的位置进行定位
相对定位不会脱离文档流，而是相对与原来的位置进行偏移
相对定位主要用于微调元素位置以及做绝对定位的参考（子绝父相）
absolute
绝对定位就是相对于离自己最近的、非 static 的祖先元素进行偏移
绝对定位会脱离标准流，设置的 margin 也会失效
绝对定位后的盒子，其 display 属性会自动变为 block，可以设置宽高了
默认情况下的绝对定位参考点
top 相对于页面的左上角，而不是视口的左上角
bottom 相对于首屏的左下角
其他情况下，绝对定位的参考点为离自己最近的且定了位的祖先元素左上角
fixed
固定定位，相对于浏览器窗口进行定位，不随页面滚动而改变
常见于 PC 端的 header、侧边广告位和移动端的 footer 等
sticky
CSS3 新增了粘性定位，元素在跨越特定阈值前表现为相对定位，之后为固定定位
以下是粘性定位的实现条件：
父元素的
overflow必须是visible，不能是 hidden 或 auto父元素的高度不能低于 sticky 元素的高度
如果父元素没有设置定位，则 sticky 元素相对于视口进行定位，否则相对于父元素
需要指定 top、bottom、left、right 四个阈值其中一个