bfc 塊級格式化上下文自己的理解

/* 
         bfc 塊級格式化上下文；
         bfc 觸發條件：
            html
            float不為none
            position為absolute 或者 fixed
            display為inline-block table-cell table-caption flex inline-flex;
            overflow不為visible；用的最多的就是overflow:hidden;
        bfc:
            bfc內部區域的box會存在在垂直的方向上 一個接一個放置；
            屬於同一個bfc區域的兩個相鄰的box的margin會發生重疊 按照最大的margin值設定展示
            每個元素的margin box的左邊 和 包含快border box的左邊相接觸；
            bfc區域不會和float box發生重疊 可以用來自適應佈局；
            bfc為頁面上獨立的容器 內部子元素不會影響外面的元素 用於解決margin重疊的問題 
                讓子元素成為bfc區域內部的子元素；
            計算bfc的高度時 浮動元素也會參與計算 也就解決了高度塌陷的問題；
          */