教育行業(yè)A股IPO第一股（股票代碼 003032）

全國咨詢/投訴熱線：400-618-4000

BFC是什么?

更新時間:2020年09月09日18時03分 來源:傳智播客 瀏覽次數:

BFC(Block formatting context)直譯為"塊級格式化上下文"。它是一個獨立的渲染區(qū)域，只有 Block-level box 參與，它規(guī)定了內部的 Block-level Box 如何布局，并且與這個區(qū)域外部毫不相干。

布局規(guī)則：

A. 內部的 Box 會在垂直方向，一個接一個地放置。

B. Box 垂直方向的距離由 margin 決定。屬于同一個 BFC 的兩個相鄰 Box 的 margin 會發(fā)生重疊。

C. 每個元素的 margin box 的左邊， 與包含塊 border box 的左邊相接觸(對于從左往右的格式化，否則相反)。即使存在浮動也是如此。

D. BFC 的區(qū)域不會與 float box 重疊。

E. BFC 就是頁面上的一個隔離的獨立容器，容器里面的子元素不會影響到外面的元素。反之也如此。

F. 計算 BFC 的高度時，浮動元素也參與計算。

哪些元素會生成 BFC

A. 根元素

B. float 屬性不為 none

C. position 為 absolute 或 fixed

D. display 為 inline-block， table-cell， table-caption， flex， inline-flex

F. overflow 不為 visible


猜你喜歡：

HTML5新增了哪些標簽?

H5是什么意思?H5是怎么發(fā)展來的?

什么是HTML，什么是H5?

0 分享到：
和我們在線交談！