目录
1、定义
2、特点
3、开启定位后的水平布局
1、定义
定位是一种布局手段，而且是一种高级的布局手段；
可以用position属性来设置定位
可选值：
不开启定位： static 默认值 不设置定位
开启定位： relative 相对定位
absolute 绝对定位
fixed 固定定位
sticky 粘滞定位
2、特点
position：relative 开启相对定位后的特点：
- 如果不设置偏移量，元素的位置不发生任何改变
- 设置偏移量，偏移量的相对位置是相对于元素原来在文档流中的位置
- 设置相对定位后，元素的性质不发生改变，不脱离文档流
- 设置相对定位后，元素的层级会提高
position：absolute 开启绝对定位后的特点：
- 元素脱离文档流
- 元素的性质发生变化，不区分块还是行内元素了
- 如果不设置偏移量，元素的位置不发生变化
- 原点是相对于其包含块来定位的
- 元素的层级提高
一般情况下，设置了元素的绝对定位，会相应设置其父元素的相对定位，我们叫做“子绝父相”。
包含块：1、默认情况下（没有定位的情况下），包含块就是元素的祖先元素；
2、如果是定位的情况下，包含块就是元素的开启了定位的，离它最近的祖先元素；
如果祖先元素都没开启定位，包含块就是跟标签（html）。
position：fixed 开启元素的固定定位后的特点：
- 用于固定在浏览器页面上，不随浏览器的滚动而改变位置
- 以浏览器为参照物，和父元素没有任何关系
- 脱离文档流，更改了元素的性质
position：sticky 开启元素粘滞定位后的特点：
- 以浏览器为参照物（体现固定定位特点）
- 占有原来位置（体现相对定位特点），不脱离文档流
- 粘滞定位可以在元素到达某个值时，将其固定
- 未到达top值之前正常显示，达到之后类似于固定定位
3、开启定位后的水平布局
left + margin-left + border-left + padding-left + width
padding-right + border-right + margin-right+right
-当开启定位后，水平方向的布局等式就会加上left，right两个值,此时规则和之前一样，只是多添加了两个值
-当发生过度约束时
1:如果9个值中没有auto，则自动调整right值以使等式满足
2:如果有auto，则自动调整auto的值以使等式满足
-可设置auto的值
margin width left right
-因为left和right的值默认是auto，所以如果不设置left和right，则等式不满足时，就会自动调整这两个值
-在left，right设置为0的时候，如果width设置auto，，无论margin如何设置，都是调整width
总结：优先级：right>left>margin-right,margin-left
水平垂直居中（定位情况下）
.box1{
width:100px;
height:100px;
position:absolute;
margin:auto;
left:0;
right:0;
top:0;
bottom:0;
}