CSS笔记-BFC、浮动

触发BFC：
1、float的值不是none。
2、position的值不是static或者relative。
3、display的值是inline-block、table-cell、flex、table-caption或者inline-flex
4、overflow的值不是visible

顺便BFC盒子一般就3个用途，不要自己搞得很复杂：

1、清除浮动，比如设置了overflow:hidden;、position:absolute;、float:left;的元素，【其内部】的浮动会被清除（注意清除浮动说的都是float产生的浮动，position:absolutefixed那不叫浮动）

2、修复margin折叠(也就是子元素设置垂直margin，结果变成父元素产生了margin的问题)

3、两栏布局自适应，仅overflow+float有效

float：
浮动元素是如何定位的
正如我们前面提到的那样，当一个元素浮动之后，它会被移出正常的文档流，然后向左或者向右平移，一直平移直到碰到了所处的容器的边框，或者碰到另外一个浮动的元素。

clear：
both - 元素被向下移动用于清除 之前 的左右浮动。
不管用用overflow:hidden

清除浮动：

	.clearfix:after{
		content: '';
		display:table-cell;
		overflow: hidden;
		clear:both;
		visibility:hidden;
	}