清除浮动的方法

清除浮动的方法

为什么要清除浮动呢？
由我们添加的float，导致父元素盒子 的高度塌陷，所以我们需要清除浮动， 常见的清除浮动的方法大概是下面几种：

  1. 额外标签法：
        就是在父级元素后面添加一个标签，并为他添加
        `clear：both`,但是这种方法我们是不推荐的。
  2.给父级元素添加`overflow:hidden`,这种方法会将超、出
        盒子的部分隐藏，所以也是不推荐的           
  3.单伪元素清除浮动：
        我们给父级元素添加一个伪元素 一般会定义一个类名：".clearfix"
        代码如下：
         .clearfix:after {
               content:"";
               display:table;
               clear:both;
               }
         .clearfix {
               zoom*:1;//兼容代码
         }
  4.双伪元素清除浮动：
         .clearfix:after,.clearfix:before {
               content:"";
               display:table;
               }
         .clearfix:after {
               clear:both;
               }
          .clearfix: {
                zoom*：1；
                }

我所了解的清除浮动的方式就这些了，希望你们能从中有所收获