清除浮动的三种方式

清除浮动的三种方式

• 第一种清除浮动

  语法 选择器 { clear:属性值 }

  属性值	描述
  left	不允许左侧有浮动元素(清除左侧浮动的影响)
  right	不允许右侧有浮动元素(清除右侧浮动的影响)
  both	同时清除左右浮动的影响

• 第二种 overflow:hidden

  .parent {
      overflow : hidden;
  }
  

• 第三种 :after伪元素法

  :after方式是额外的标签法的升级版。也是给父元素添加的

  .clearFix:after {
      content:'';
      display:block;
      height:0;
      clear:both;
      visibility:hidden;
  }
  .clearFix {
      /*IE7 IE7 专用*/
      *zoom:1;
  }
  

  1. 优点 : 没有增加标签、结构更简单。
  2. 缺点 ：兼容低版本浏览器
  3. 代表网站 ： 百度、淘宝、网易