静态定位：静态定位是默认值，就是之前认识的标准流。
代码：postion:static
静态定位不能通过方向偏移值来改变。
相对定位：自恋型定位，相对于自己之前的位置进行移动。
代码：postion:relative
需要配合访问属性来移动相对于自己原来的位置进行移动在页面中占位置→没有脱标应用场景 ：配合绝对定位组cp（子绝父相），用于小范围的移动。
绝对定位：拼爹型定位，相对于非静态定位的父元素进行移动。
代码：position:absolute
需要配合方位属性实现移动默认相对于浏览器可视区域进行移动在页面中不占位置→已经脱标应用场景 ：配合相对定位组CP（子绝父相）
绝对定位相对于谁移动？
祖先元素中没有定位 → 默认相对于浏览器进行移动祖先元素中有定位 → 相对于最近的 有定位 的祖先元素进行移动固定定位：相对于浏览器窗口进行定位，脱离原来的文档流。
代码：position:fixed
子绝父相含义： 子元素用绝对定位，父元素用相对定位。
应用场景： 让子元素相对于父元素进行自由移动。
好处： 父元素是相对定位，对网页布局影响最小。
子绝父绝特殊场景：
场景： 在使用子绝父相的时候，发现父元素已经有相对定位了，此时直接子绝即可！
原因： 父元素已经有定位已经满足要求，如果盲目修改父元素定位方式，可能会影响之前写好的布局。
设置偏移值：水平和垂直就近各取一个水平方向：
left：数字+px 距离左边的距离right：数字+px 距离右边的距离垂直方向：
top：数字+px 距离上边的距离bottom：数字+px 距离下边的距离基本写法：
代码语言：javascript复制.blue {
/* 设置定位方式 */
position: absolute;
top: 150px;
left: 150px;
background-color: blue;
}