为什么要清除浮动？

设置float的元素会脱离文档流，导致父元素高度塌陷

4种清除浮动的方式

1. 给父元素设置overflow属性，创建了一个BFC
2. 给父元素设置高度
3. 在父元素内最底下添加额外的标签并给标签设置style="clear:both"
4. 用css伪类给父元素添加元素，方法如下

/* :after 在css中追加元素 */
  .parent:after{
    /* 空内容 */
    content: '';
    /* 块级元素 */
    display: block;
    /* 0高度 */
    height: 0;
    /* 不可见但保留空间 */
    visibility: hidden;
    /* 清除浮动 */
    clear: both;
  }