为什么需要浮动？

在标准流的很多情况下，无法实现些布局效果，这个时候就可以使用浮动，浮动可以改变元素标签的默认排列方式。 浮动本身最初是做文字环绕效果的。

float:left;/*  左浮动*/
float：right;/*右浮动 */

为什么需要清除浮动？

在很多情况下，父元素的盒子不方便设置高度，子元素又不占位置，所以当父元素的高度为零时，就会影响下面的标准流的盒子。 （我常用的四种清除浮动的四种方法）

1. 隔墙法（w3c推荐的方法）就是在浮动元素的末尾添加一个空的标签
2. 给父元素添加overflow属性
3. 父元素添加after伪元素
4. 父元素添加双伪元素

1.<div style="clear:both;"></div>
4.  .clear::after{
        content:"";
        display:block;
        height:0;
        clear:both;
        visibility:hidden;
    }
5.   .clear::before,.clear::after{
        content:"";
        display:table;
     }
     .clear::after{
         clear:both;
     }