元素定位
1.静态定位 static 默认值
没有定位
2.相对定位 relative
-
相对于自己原位置定位
-
定位后原位置保留
-
配合left、right、top、bottom移动
-
当四个属性同时存在，left top的优先级大于right和bottom
-
应用场景： 自己小范围移动或者配合绝对定位使用
3.绝对定位 absolute
-
相对于已经定位的父元素定位，
-
如果父元素没有定位，逐级往上找，最后相对于body定位
-
定位后原位置不保留
-
配合left、right、top、bottom移动
-
当四个属性同时存在，left top的优先级大于right和bottom
-
应用场景： 形成独立的一层
4.固定定位 fixed
-
相对于浏览器窗口定位
-
定位后原位置不保留
-
配合left、right、top、bottom移动
-
当四个属性同时存在，left top的优先级大于right和bottom
-
应用场景： 固定在页面某个位置
5.sticky
- C3新增属性，相当于relative和fixed的结合
- 配合left right top right 移动（当四个属性同时存在，left top的优先级大于right bottom）
6.z-index:;
- 堆叠顺序 默认值auto 和父元素的层级一致
- 取值越大，层级越往上
- 可以取负值，不推荐
- 必须配合定位使用（static 不可以）
- 当两个元素同时定位，后面的元素在上面
