BFC与清除浮动

BFC 的特性

1. 内部的 Box 会在垂直方向上一个接一个的放置。
2. 垂直方向上的距离由 margin 决定
3. bfc 的区域不会与 float 的元素区域重叠。
4. 计算 bfc 的高度时，浮动元素也参与计算
5. bfc 就是页面上的一个独立容器，容器里面的子元素不会影响外面素。

如何清除浮动？

不清除浮动会发生高度塌陷：

浮动元素父元素高度自适应（父元素不写高度时，子元素写了浮动后，父元素会发生高度塌陷）

1. clear清除浮动（添加空div法）在浮动元素下方添加空div,并给该元素写css样式： {clear:both;height:0;overflow:hidden;}
2. 给浮动元素父级设置高度
3. 父级同时浮动（需要给父级同级元素添加浮动）
4. 父级设置成inline-block，其margin: 0 auto居中方式失效
5. 给父级添加overflow:hidden 清除浮动方法
6. 万能清除法 after伪类 清浮动（现在主流方法，推荐使用）

.float_div:after{
	content:".";	
	clear:both;	
	display:block;	
	height:0;	
	overflow:hidden;	
	visibility:hidden;	
	}
	
.float_div{
	zoom:1
	
}