说不清的BFC

文章预览

说个故事先。曾经有人问大法官，什么是色情，究竟如何定义。大法官说：“我也答不上来，可是当你给我看的时候，我就能告诉你是不是。 ”恰好，我们今天要说的BFC就是这么一种东西，要你说你说不好，但是你一看到就知道，并且你还经常使用。全称是 Block Formatting Context ，翻译成块格式化上下文。让我们先来看看它在MDN上面的定义。 一个块格式化上下文（block formatting context） 是Web页面的可视化CSS渲染出的一部分。它是块级盒布局出现的区域，也是浮动层元素进行交互的区域。 一个块格式化上下文由以下之一创建： 根元素或其它包含它的元素 浮动元素 (元素的 float 不是 none)绝对定位元素 (元素具有 position 为 absolute 或 fixed) 内联块 (元素具有 display: inline-block) 表 ………………………………