HTML清除浮动

清浮动

为什么要清浮动
当元素浮动的时候，会脱离父级文档流，不会撑开父级的高度，引起页面布局的混乱，因此需要清除浮动产生的影响

    清除浮动的方法
    1.通过测量高度，直接给父级设置具体的高度
    2.给父级添加display：inline-block，也可以清除浮动(低版本ie不支持)
    3.给父级添加最后一个子元素，是一个空标签，用他来清浮动，添加的样式为
        clear：both;
        height：0;
        overflow：hidden;
    因此在低版本ie下默认行高，因此需要设置行高为0
    4.给父级添加 overflow：hidden;   缺点：ie7及其以下版本不能使用，父级有超出定位的元素，不能使用
    5.可以给父级添加浮动，如果父级浮动则子级的浮动不用清除
    6.通过after伪元素清除浮动

/* 设置清浮动的class*/
    .clear{
        clear:both;
        height:0;
        overflow:hidden;
    }
    /* after伪元素清浮动 */
    .clearfix:after{
        clear: both;
        content: '';
        display: block;
        height: 0;
        visibility: hidden;
        _zoom:1;
    }