1. div {
  2. clear: both;
  3. }
属性值 描述
left 清除左边浮动
right 清除右边浮动
both 清除两侧浮动

清除浮动的方法

额外标签法

<div style="clear:both;"></div>

在浮动元素末尾添加一个空的标签

父元素添加overflow属性

div {
  overflow: hidden;
}

父元素添加after伪元素

.clearfix:after {
  content: "";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

.clearfix { /* IE6、7 */
  *zoom: 1;
}

父元素添加双伪元素

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

.clearfix:after {
  clear: both;
}

.clearfix {
  *zoom: 1;
}