2020-09-03（绝对定位元素的布局）

1.绝对定位元素的布局
当我们开启了绝对定位

• 水平方向的布局等式就需要添加left和right两个值
  left+margin-left+border-left+padding-left+width+padding-right+border-right+margin-right+right=包含块的内容区的宽度
  此时规则和之前的一样只是多添加了两个值：
  当发生过度约束：
  若9个值中没有auto则自动调整right值以使等式满足
  如果有auto，则自动调整auto的值以使等式满足
  可设置auto的值：margin width left right
  因为left和right的值默认是auto，所以如果不知道left和right，则等式不满足时，会自动调整这两个值

• 垂直方向布局的等式也必须要满足
  top+margin-top+border-top+padding-top+height+padding-bottom+border-bottom+margin-bottom+bottom=包含块的内容区的高度

• 我们可以利用这一属性设置元素在包含块中垂直水平居中（开启绝对定位后）

position: absolute;
margin: auto;
left: 0;
right: 0;
top: 0;
bottom: 0;