(1)憔维、什么是BFC與IFC
a、BFC（Block Formatting Context）即“塊級格式化上下文”畏邢， IFC（Inline Formatting Context）即行內(nèi)格式化上下文业扒。常規(guī)流（也稱標準流、普通流）是一個文檔在被顯示時最常見的布局形態(tài)舒萎。一個框在常規(guī)流中必須屬于一個格式化上下文程储，你可以把BFC想象成一個大箱子，箱子外邊的元素將不與箱子內(nèi)的元素產(chǎn)生作用。
b章鲤、BFC是W3C CSS 2.1 規(guī)范中的一個概念摊灭，它決定了元素如何對其內(nèi)容進行定位，以及與其他元素的關系和相互作用败徊。當涉及到可視化布局的時候帚呼，Block Formatting Context提供了一個環(huán)境，HTML元素在這個環(huán)境中按照一定規(guī)則進行布局集嵌。一個環(huán)境中的元素不會影響到其它環(huán)境中的布局萝挤。比如浮動元素會形成BFC，浮動元素內(nèi)部子元素的主要受該浮動元素影響根欧，兩個浮動元素之間是互不影響的怜珍。也可以說BFC就是一個作用范圍。
c凤粗、在普通流中的 Box(框) 屬于一種 formatting context(格式化上下文) 酥泛，類型可以是 block ，或者是 inline 嫌拣，但不能同時屬于這兩者柔袁。并且， Block boxes(塊框) 在 block formatting context(塊格式化上下文) 里格式化异逐， Inline boxes(塊內(nèi)框) 則在 Inline Formatting Context(行內(nèi)格式化上下文) 里格式化捶索。
(2)、如何產(chǎn)生BFC
當一個HTML元素滿足下面條件的任何一點灰瞻，都可以產(chǎn)生Block Formatting Context：
a腥例、float的值不為none
b、overflow的值不為visible
c酝润、display的值為table-cell, table-caption, inline-block中的任何一個
d燎竖、position的值不為relative和static
CSS3觸發(fā)BFC方式則可以簡單描述為：在元素定位非static，relative的情況下觸發(fā)要销，float也是一種定位方式构回。
(3)、BFC的作用與特點
a疏咐、不和浮動元素重疊纤掸，清除外部浮動，阻止浮動元素覆蓋
如果一個浮動元素后面跟著一個非浮動的元素浑塞，那么就會產(chǎn)生一個重疊的現(xiàn)象借跪。常規(guī)流（也稱標準流、普通流）是一個文檔在被顯示時最常見的布局形態(tài)缩举，當float不為none時，position為absolute、fixed時元素將脫離標準流仅孩。
