创建bfc
创建bfc - 内联块 (元素具有 display: inline-block)
div1 --- margin-bottom: 10px;
div2 --- margin-top: 10px; display: inline-block;
div2成为内联块，所以div2创建了一个新的bfc，div1与div2不同属于同一个bfc，所以垂直margin无法合并
创建bfc - 浮动元素 (元素的 float不是 none)
div1 --- margin-bottom: 10px;
div2 --- margin-top: 10px; float: left;
div2成为浮动元素，所以div2创建了一个新的bfc，div1与div2不同属于同一个bfc，所以垂直margin无法合并
创建bfc - 定位元素 (元素具有 position为 absolute 或 fixed)
div1 --- margin-bottom: 10px;
div2 --- margin-top: 10px; position: absolute;
div2成为定位元素，所以div2创建了一个新的bfc，div1与div2不同属于同一个bfc，所以垂直margin无法合并
创建bfc - 具有 overflow 且值不是 visible 的块元素（第一种：div2没有父级）
div1 --- margin-bottom: 10px;
div2 --- margin-top: 10px; overflow: auto;
div2设置了overflow值，但是无效
创建bfc - 具有 overflow 且值不是 visible 的块元素（第二种：div2有父级）
div1 --- margin-bottom: 10px;
div2 --- margin-top: 10px;
div2父级设置了overflow值，生成bfc