外边距合并问题-盒模型-垂直居中-清除浮动

1.外边距合并问题 高频面试题
    父子级:给父元素添加边框
            给子元素清除浮动 overflow：hidden
            给父元素一方设置display：inline-block
    兄弟级;将margin设置到一个元素上
2.盒模型
    w3c盒子（默认盒子，内容合作）box-sizing:content-box
        width,height content内容区宽高
        盒子的宽：width+paddingLeft+paddingRight+borderLeft+borderRight  
        盒子的高：height+paddingTop+paddingBottom+borderTop+borderBottom 
        所占屏幕区域的宽：盒子的宽+左右margin
        所占屏幕区域的高：盒子的高+上下margin
    IE盒子 box-sizing:border-box
        width,height 盒子的宽高
        盒子的宽：width
        盒子的高：height
        所占屏幕区域的宽：盒子的宽+左右margin
        所占屏幕区域的高：盒子的高+上下margin
        区别：高频面试题
        【注意】：如果涉及到盒子内部间距的调整，我们优先使用padding
3.嵌套元素水平垂直居中： 面试题 必问
    水平垂直居中
        1.通过外边距调整，根据复制元素的宽高来计算外边距的值。（父子都是块级元素）
        2.定位/定位+浮动 代补充
            水平方向居中：margin：0 auto
4.布局
    搭建网页框架结构时，自上而下，由外向内 顺序
5.清除浮动
    给父元素设置：overflow：hidden
    给末尾添加一个空白的块元素，然后对其清除浮动
    .clearfix::after{
​            				/*添加一个内容*/
​            				content: "";
​           				/*转换为一个块元素*/
​            				display: block;
​           				/*清除两侧的浮动*/
​            				clear: both;
​        			}