盒子的水平布局

元素水平方向的布局：

元素在父元素中水平方向的位置由以下几个属性共同决定：

margin-left

border-left

padding-left

width

padding-right

border-right

margin-right

一个元素在其父元素中，必须满足以下等式:

margin-left+border-left+padding-left+width+padding-right+border-right+margin-right=父元素内容区宽度

如果等式不成立，则称为过渡约束，等式会来使等式成立

如果这七个值中没有auto，则浏览器会自动调整margin-right（可以为负值）的值，来使其成立

这七个值有三个可以设置为auto：

width

margin-right

margin-left

如果设置了auto，则浏览器会调整设置auto的值

width默认的值就是auto

如果width和一个外边距设置为auto，则宽度调到最大，外边距为0

如果将三个值都设置为auto，则宽度最大，外边距都为0

如果width固定值，两个外边距都设置为auto，则两个外边距平均取缺的值（使元素水平居中）

示例：

width：xxx;

margin：0 auto；