float浮动

清除浮动的意义在于 屏蔽浮动的元素对后面元素产生的影响

CSS定位机制：普通流、浮动、定位

普通流（标准流）：默认状态，元素自动从左往右，从上往下的排列。

浮动基础知识

1、会使元素向左或向右移动，只能左右，不能上下。

2、浮动元素碰到包含框或另一个浮动框，浮动停止。

3、浮动元素之后的元素将围绕它，之前的不受影响。

4、浮动元素会脱离标准流。

5、浮动的基本语法   float：left | right | none

使用浮动后产生的问题 

元素使用浮动后会脱离普通流，出现“高度塌陷”，也叫浮动溢出。

清除浮动（闭合浮动）

清除浮动语法 ：clear：none | left | right | both;设置了float的元素会影响其他相邻元素，需要使用clear清除浮动，clear只会影响自身，不会对其他相邻元素造成影响。 

清除浮动常用方法常用方法

方法一：在浮动元素后使用一个空元素。例如：<div class="clear"> </div>

方法二：给浮动元素的容器添加overflow：hidden；小的范围

方法三：使用CSS3的：after伪元素（当下比较主流的方法） 大的盒子之类的

代码： 给浮动元素的容器添加一个类名，如clearfix

    <style>
          .clearfix:after{
              content: ".";
              display:block;
              height:0;
              visibility:hidden;
              clear:both;
            }
    </style>

元素浮动后具备inline-block属性