摘抄自【[https://www.cnblogs.com/xiaohuochai/p/5248536.html](https://www.cnblogs.com/xiaohuochai/p/5248536.html)】 ### **滿足下列條件之一就可觸發BFC** 【1】根元素，即HTML元素 【2】float的值不為none 【3】overflow的值不為visible 【4】display的值為inline-block、table-cell、table-caption 【5】position的值為absolute或fixed ### **BFC是頁面上的一個隔離的獨立容器，容器里面的子元素不會影響到外面元素，反之亦然。它與普通的塊框類似，但不同之處在于:** * **可以阻止元素被浮動元素覆蓋** * **可以包含浮動元素** * **屬于同一個BFC的兩個相鄰塊級子元素的上下margin會發生重疊，(設置writing-mode:tb-rl時，水平margin會發生重疊)。所以當兩個相鄰塊級子元素分屬于不同的BFC時可以阻止margin重疊** *