BFC清除浮动

BFC 就是清除浮动 用来处理文档脱离文档流的问题

清除浮动的方法：

  a、父元素也添加一个浮动

     产生弊端就是：margin 不能使用

  b、给父元素添加一个:display:inline-block

      弊端同a同样：没法使用margin

  c、给父元素添加高

      弊端：扩展性很差，咱们没法随意再添加元素

  d、 br标签

     做用换行
     弊端：把不符合w3c的规范：结构样式行为三者分离。因此不是很推荐
    
  e、clear样式：规定元素的那一侧不容许其余元素浮动
 
  f、伪类清浮动
     .clear:after{
     content:"";//给元素添加一个空的内容
     display:block;//让这个空的元素成为一个块元素;
     clear:both;//再让这个元素旁边两侧都不容许浮动
   
   }//after这个伪类ie六、7不兼容，ie8及以上才能够
   clear{
   zoom:1;
   }
   舒适提示：目前主流方法；
    clear:left;
    clear:right;
    clear:both;推荐使用
    clear:one;
     例如：
     <div id="box" class="clear">
      <span class="1"></span>
       <span class="1"></span>
        <span class="1"></span>
         <span class="1"></span>
          <span class="1"></span>
          <br clear="all"/>
     </div>