清除浮动Clearfix

HTML

<div class="clearfix">
  <div class="floated">float a</div>
  <div class="floated">float b</div>
  <div class="floated">float c</div>
</div>

 css

.clearfix::after {
   content: '';
   display:block;
   clear：both;
}
.floated {
   float: left;
}

 扩展：

1、.clearfix::after 定义一个伪元素

2、content: '' 允许伪元素影响布局

3、clear: both 清除浮动