原文
什么是格式化上下文（formatting contexts）
Formatting context是W3C CSS2.1規(guī)范中的一個(gè)概念。它是頁(yè)面中的一塊渲染區(qū)域让簿，并且有一套渲染規(guī)則噩峦，它決定了其子元素將如何定位，以及和其他元素的關(guān)系噪舀、相互作用魁淳。
格式化上下文指的是初始化元素定義的環(huán)境。包含兩個(gè)要點(diǎn)与倡，元素定義的環(huán)境和初始化界逛。
在 CSS 中，元素定義的環(huán)境有兩種纺座，一種是塊格式化上下文( Block formatting context )息拜，另一種是行內(nèi)格式化上下文( Inline formatting context )。 這兩種上下文定義了在 CSS 中元素所處的環(huán)境净响，格式化則表明了在這個(gè)環(huán)境中少欺，元素處于此環(huán)境中應(yīng)當(dāng)被初始化，即元素在此環(huán)境中應(yīng)當(dāng)如何布局等馋贤。
格式化上下文包含以下幾種情況
a：塊級(jí)格式化上下文( Block formatting contexts )( BFC )
b：行內(nèi)格式化上下文( Inline formatting contexts ) ( IFC )
c：自適應(yīng)格式化上下文( Flex Formatting Contexts )( FFC )（CSS3新增）
d：網(wǎng)格布局格式化上下文( GridLayout Formatting Contexts )( GFC )（CSS3新增）
BOX:CSS布局的基本單位
Box 是 CSS 布局的對(duì)象和基本單位赞别， 直觀點(diǎn)來(lái)說(shuō)，就是一個(gè)頁(yè)面是由很多個(gè) Box 組成的配乓。元素的類型和 display 屬性仿滔，決定了這個(gè) Box 的類型惠毁。 不同類型的 Box崎页， 會(huì)參與不同的 Formatting Context（一個(gè)決定如何渲染文檔的容器）鞠绰，因此Box內(nèi)的元素會(huì)以不同的方式渲染。讓我們看看有哪些盒子：
a：block-level box:display 屬性為 block, list-item, table 的元素飒焦，會(huì)生成 block-level box蜈膨。并且參與 block fomatting context；
c：inline-level box:display 屬性為 inline, inline-block, inline-table 的元素牺荠，會(huì)生成 inline-level box翁巍。并且參與 inline formatting context；
