CSS布局深入简出——细谈块格式化上下文（BFC）
BFC是什么？ 对于刚学习html、css的小白来说，这个概念很模糊，在一些前端的面试题中经常被提起，为什么人们经常理解不了？ 从名字中，只能看出“块”、“格式化”、“上下文”，那么它到底有扫描作用，我们还是一无所知的，格式化上下文？可能是对上下文起作用的吧。 从名字中我们，我们只能知道是一个功能，对html文档起作用。 官方解释 MDN： 块格式化上下文（Block Formatting Context，BFC） 是Web页面的可视CSS渲染的一部分，是块盒子的布局过程发生的区域，也是浮动元素与其他元素交互的区域。 下列方式会创建块格式化上下文： 根元素（） 浮动元素（元素的 float 不是 none） 绝对定位元素（元素的 position 为 absolute 或 fixed） 行内块元素（元素的 display 为 inline-block） 表格单元格（元素的 display 为 table-cell，HTML表格单元格默认为该值） 表格标题（元素的 display 为 table-caption，HTML表格标题默认为该值） 匿名表格单元格元素（元素的 display 为 table、table-row、 table-row-group、table-header-group、table-footer-group（分别是HTML table、row、tbody