浮动元素规则

一、一旦读懂后，脱离标准流

1. 朝着想做或享有方向移动，知道自己的边界紧贴着包含块（一般是父元素）或者其它浮动元素的边界为止。

2. 定位元素会层叠浮动元素上（下层普通非定位元素、中层浮动元素、上层定位元素（position非static))

二、如果元素是向左（向右）浮动，浮动元素的左（右）边界不能超出包含块的左（右）边界

三、浮动元素之间不能层叠

1. 如果一个元素浮动，另一个浮动元素已经在那个位置了，后浮动的元素将紧贴着前一个浮动元素（左浮动找左浮，右浮找右浮）

2. 如果水平方向剩余的空间不够显示浮动元素，浮动元素将向下移动，直到有重组的空间为止。

四、浮动元素不能与行内级内容层叠，行内级内容将会被浮动元素推出（比如行内级元素、inline-block元素、块级元素的文字内容）

五、行内级元素、inline-block元素浮动后，其顶部将与所在行的顶部对齐。

清除浮动：一般用伪元素

 .clear_fix::after{
          display: block;
          content:'';
          clear: both;
          visibility: hidden;/*浏览器兼容*/
          height: 0;/*浏览器兼容*/
      }
      .clear_fix{
          zoom:1;/*IE6/7兼容*/
      }

z-index需要与定位结合使用才生效，一般为了不影响页面效果直接和relative结合，当然fixed和absolute也对它有效果的（只是会脱离文档流）