CSSfloat浮动

文档流

文档流是文档中可显示对象在排列时所占用的位置

如何理解float浮动

脱离文档流，延迟父容器靠左或靠右进行排列。（left\right\none）

float特性

加浮动的元素，会脱离文档流，会延迟父容器靠左或靠右排列，如果之前已经有浮动的元素，会挨着浮动的元素进行排列。

浮动注意点

1.只会影响后面的元素。
2.内容默认提升半层。
3.默认宽根据内容决定。
4.换行排列。
5.主要给块元素添加，但也可以给内联元素添加（很少用）。

如何清除浮动？

上下排列：clear属性，表示清除浮动的。（left,right,both)
嵌套排列：
1.固定宽高：不推荐，不能把高度固定死，不适合做自适应的效果。
2.父元素浮动：不推荐，因为父容器浮动也会影响到后面的元素
overflow:hidden(BFC规范），如果有子元素想溢出，那么会收到影响，被截掉
display:inline-block(BFC规范），不推荐，父容器会影响到后面的元素。
设置空标签：不推荐，会多添加一个标签。
after伪类：推荐，是空标签的加强版，目前各大公司的做法。
.clear:after{content:" "; clear:both; display:block}
（clear属性只会操作块标签，对内联标签不起作用。）