清除内部浮动的常用方法

1. 使父元素触发形成BFC（Block Formatting Context），最常见的就是设置overflow: hidden；
2. afeter伪元素清除浮动

       .clearfix::after {
           display: block;
           content: ".";
           clear: both;
           visibility: hidden;
           height: 0;
           line-height: 0;
       }
       
       .clearfix {
           *zoom: 1;     /*兼容IE*/
       }

   给需要清除浮动的元素添加这个样式（clearfix）即可

3. 双伪元素清除浮动

   
       .clearfix::before,.clearfix::after {
           content: ".";
           display: table; /*触发BFC*/
       }
       .clearfix: after {
           clear: "both";
       }
       .clearfix {
           *zoom: 1;     /*兼容IE*/
       }

   同上，给需要清除浮动的元素添加这个样式（clearfix）即可

4. 额外标签法（不推荐），在浮动元素末尾添加一个空的标签例如 <div style="clear:both"></div>，或则其他标签br等亦可