格式化上下文 是页面上的一块独立渲染区域。 它决定了其子元素如何排列，以及该区域如何与其他元素相互作用。
一句话本质：它是一个“结界”。结界里的内政（布局）由结界主说了算，且结界内发生的混乱（如浮动、外边距合并）不会泄露到结界外。
A1. 要素 (类型) MDN 文档提到了几种主要的上下文，这代表不同的“特区规则”：
- BFC (Block Formatting Context): 处理块级盒子。最常用，用于清除浮动、防止 margin 重叠。
- IFC (Inline Formatting Context): 处理行内盒子（文字）。决定文字如何折行、如何对齐。
- Flex / Grid Context: 现代布局产生的上下文，规则更强大。
A2. 结构 (触发条件) “结界”不是天然存在的，需要用特定的 CSS 咒语召唤（触发）：
- float 不为 none。
position为 absolute 或 fixed。display为 inline-block, flex, grid, flow-root 等。overflow不为 visible (最常用的黑魔法，如overflow: hidden)。
A3. 系统 (涌现功能 - BFC 的三大铁律)
- 内部箱子垂直放： 里面还是遵循文档流。
- 排除浮动： BFC 区域不会与浮动元素重叠（会自动收缩避开浮动）。
- 包含浮动： 计算 BFC 高度时，浮动子元素也参与计算（这是最重要的功能，用于解决“高度塌陷”）。