清除浮动的方法

方法一
重点：overflow
解析：通过给父元素添加overflow: hidden;触发BFC的方式来清除浮动，缺点是子元素内容溢出则会被隐藏。

    .fahter{
        width: 400px;
        border: 1px solid red;
        overflow: hidden;
    }

方法二
重点：after
解析：通过给元素添加结尾伪元素的方式清除浮动，符合闭合浮动思想，结构语义化正确

    .clearfix:after{    /*伪元素是行内元素 正常浏览器清除浮动方法*/
        content: "";
        display: block;
        height: 0;
        clear:both;
        visibility: hidden;
    }

方法三
重点：before、after
解析：使用before和after双伪元素清除浮动，代码更简洁

    .clearfix:after,.clearfix:before{
        content: "";
        display: table;
    }
    .clearfix:after{
        clear: both;
    }