CSS中的BFC是指塊級格式化上下文，它是一個獨立的渲染區域，具有一定的上下文和隔離性。BFC可以有效地解決一些布局問題，比如外邊距合并、清除浮動、避免父元素被子元素撐開等問題。那么如何在CSS中實現BFC呢？

一、常見的BFC觸發方式
1. 根元素（即html元素）
2. float屬性不為none
3. display為inline-block、table-cell、table-caption或者flex
4. position為fixed或者absolute
5. overflow不為visible
二、如何使用overflow屬性觸發BFC
如果需要觸發BFC，可以定義一個容器元素，給該元素設置一定的寬高并設置overflow為hidden、auto或者scroll。當然，也可以給該元素設置一個比較大的padding值來達到同樣的效果。由于overflow屬性觸發的BFC會使該元素具有一定的上下文和隔離性，所以可以解決外邊距合并、清除浮動、避免父元素被子元素撐開等問題。
三、BFC的一些應用場景
1. 避免外邊距合并問題
當兩個相鄰的元素的margin-top和margin-bottom值都設置為非0值時，無論是上面的元素的margin-bottom還是下面的元素的margin-top，最終的間距都等于兩個margin值的較大的那個值。如果我們需要使這兩個元素之間的間距等于兩個margin值的和，可以將其中一個元素放在一個BFC容器中，這樣間距就等于兩個margin值的和了。
2. 清除浮動問題
在浮動元素的容器中設置overflow屬性為hidden、auto或者scroll，可以清除該容器的后代浮動元素對其高度的影響，避免出現高度塌陷等問題。
3. 避免父元素被子元素撐開問題
子元素設置為float或者絕對定位后，會脫離正常文檔流，不會再對父元素的高度產生影響，導致父元素的高度無法自適應。此時可以給父元素設置overflow:hidden屬性，使其形成一個BFC，從而避免子元素對其高度的影響，父元素就可以自適應高度了。