浮动的应用场景：
1）页面中的左右结构
实现：
父元素 .clearfix
左 float:left
右 float:right
2）页面中多列布局
实现：
父元素 .clearfix
第1列 float:left
第2列 float:left
第3列 float:left
第4列 float:left
..
每一列中间的间隙。 margin-right
中间1px边框的问题 margin负值
3）左侧固定宽度，右侧自适应
实现：
父元素： 当父元素的宽度变化时，那么右侧的宽度也跟着变化
左侧 宽度必须 浮动
右侧 margin-left
4）页面中的左中右结构
实现
父元素： 不需要清除浮动
左：左浮动
中：文本： text-align:center; 盒子： margin:0 auto;
右：右浮动
初衷：实现字围效果
目的：让块级元素并排显示
flex布局
右浮动的问题:
有的浏览器有这个问题，有的没有。还有在IE的低版本浏览器中，浮动也有很多问题。
最后个元素右浮动了，但是没有左浮动，最后面右浮动的元素有非常奇怪换行。
