CSS浮动基础及清除浮动方法

css定位分为三种：标准流、浮动、绝对定位。
标准流：默认状态下，元素自动从左往右，从上往下的排列。

浮动的基础知识：
1、会使元素向左或向右移动，只能左右，不能上下。
2、浮动元素碰到包含框或另一个浮动框，浮动停止。
3、浮动元素之后的元素将围绕它，之前的不受影响。
4、浮动元素会脱离标准流。
5、元素浮动后具备inline-block属性。

浮动的基本语法：
float：none；  没有浮动；
float：left；  左浮动；
float：right； 右浮动；
float：inherit；继承父元素的浮动；

浮动注意的地方：
使用浮动的时候，子元素的浮动会导致父元素发生塌陷，因为子元素进行了浮动，脱离了标准流，使得父元素无法检测到子元素，导致父元素塌陷、没有高度；同理，因为浮动元素脱离了标准流，使得临近元素无法感知到浮动元素，使得普通元素占据浮动元素的位置，发生异位。

使用clear属性清除浮动，clear 属性可选参数值为left 、 right 、 both、 none、 inherit。
设置了float的元素会影响其他相邻元素，需要使用clear清除浮动，clear只会影响自身，不会对其他相邻元素造成影响。

清除浮动的三种方法：
1在父元素内最后一行增加一个div 设置class,增加样式clear:both。
2在父元素class里面添加样式overflow:hidden;zoom:1;(兼容低版本)。
3在父元素class添加伪类：
    .class:after{
        content:'';
        height:0;
        display:block;
        visibility:hidden;
        clear:both;
    }
    .class{
        zoom:1;
    }