清除浮动的方法

解决子元素浮动导致父元素没有高度的问题：

1. 给父元素添加 overflow: hidden (不推荐,会裁切元素之外的内容);

2. 手动给父元素高度 (不灵活);

3. 在父元素内部的结尾部分, 加一个块元素（不是块元素转为块元素）, 并让该元素清除同级浮动

4. 给父元素after伪元素, 把after转成块元素, 给after清除同级浮动

第一种方法： overflow: hidden

/* overflow: hidden; */

第二种方法：手动给

/* height: 700px; */

第三种方法：最后给一个块元素，不是块元素转为块元素 ，清理浮动

示例：

 第四种方法：给父元素一个：after，加了after就不是块元素，要转为块元素，然后清理浮动 

示例：