定位：position

定位:poaition(写在需要定位的元素上)。

1. 相对定位;position:relative;(相对定位元素的定位是相对其正常位置)。
2. 固定定位;position:fixed;(元素的位置相对于浏览器窗口是固定位置,即使窗口滚动，它也不移动)。
3. 绝对定位;position:absolute;(绝对定位的元素的位置相对于最近的已定位父元素，如果元素没有已定位的父元素,那么它的位置相对于根元素html)。
4. 粘性定位;position:sticky;(粘性定位的元素是依赖于用户的滚动)。

偏移量:必须开起定位后才能激活偏移量。
px: %:相对父元素，有确定长度的父元素才可以设置百分比，块级元素宽度100%
top:正数往下,负数往上。
right:正数往左👈，负数往右👉。
bottom:正数往上，负数往下。
left:正数往右👉，负数往左👈。

相对定位:relative

1.不脱离文档流。
2.不设偏移量时没有如何变化。
3.0点是元素本身的位置。
4.元素的层级会变高。
5.因为不脱离文档流所以页面上还占空间。

层级问题:

1. 同一个层级下，标签写在最下面的层级高。
2. z-index：n;(数越大，层级越高)。

绝对定位:absolute

1.会脱离文档流。
2.宽度丢失。
3.多个同级元素设置为绝对是，会堆成一起。
4.不设偏移量时没有任何变化。
5.0点开启了绝对定位时，会去找最近已有定位的父元素或祖元素，如果元素没有已定位的父元素，则会找到根元素定位。
6.父元素会出现高度塌陷问题，BFC也不能解决问题。解决方法有:给父元素添加宽高就可以解决。

固定定位:fixed

1.脱离文档流。
2.0点永远基于根元素。
3.永远固定在屏幕上。
4.特殊的绝对定位。

粘滞定位:sticky

1.不脱离文档流。
2.不设置偏移量时没有效果。
3.特殊的相对定位。
4.当元素到达指定位置时会粘滞不动。