BFC环境(block formatting context块级格式化上下文)

 布局规则：
    1.在BFC环境内部的所有元素按照垂直方向上一个接一个的放置；
    2.相邻盒子（BOX）在垂直方向的margin值会重叠；
    3.内部盒子会以BFC的左边（右边）线接触，浮动也是这样的；
    4.BCF区域不会与浮动盒子重叠；
    5.BFC环境中的子元素以外界分离，不会影响到外面的元素，而外面的元素也不会影响到BFC里面的元素。
    6.BFC中浮动元素会参与计算。
BFC的触发方式：
    一下的值都会触发BFC：
    float：的值不为none，都会触发BFC。
    position:absolulute,fixed
    display:in-line-block,table-cell,table-caption,flex,in-line-fiex.
    overflow:不为visible.

IFC环境（in-line formatting context行级格式化上下文）

布局规则：
    1.IFC中的元素会在一行从左到右依次排列；
    2.在一行上的所有元素会在该区域形成一个行框；
    3.行框的宽度为包含框的宽度，高度为行框中最高元素的高度；
    4.浮动的元素不会在行框中，并且浮动元素会压缩行框的宽度；
    5.行框的宽度容纳不下子元素时，子元素会换到下一行，并且产生新的行框；
    6.行框内的元素遵循   text-align   和    vartical-align;9