CSS教程：3种清除浮动的方法详解

1. 使用空元素清除浮动

.clearfix::after {
  content: '';  /* 空内容 */
  display: block;  /* 块级元素 */
  height: 0;  /* 高度为0 */
  clear: both;  /* 清除浮动 */
}

2. 使用父元素清除浮动

.parent:after {
  content: '';  /* 空内容 */
  display: block;  /* 块级元素 */
  height: 0;  /* 高度为0 */
  clear: both;  /* 清除浮动 */
}

3. 使用 CSS 样式清除浮动

.clearfix {
  overflow: auto;
}