清除浮动的原因：当我们没有给父元素添加高度时，将里面子元素添加浮动（如：float:left）,这样无法撑大父盒子，造成布局混乱。
清除浮动要注意，要给浮动元素的父元素清除浮动，用clear：both语句；旧时我们经常给父元素添加一个带有clear：both的块级子元素，这种方法给多个盒子清除浮动时，会创造出大量无用块级元素，增加服务器压力，而使用after伪元素添加子元素（转化成块级元素）清除浮动，创造的子元素并不会显示在html树中，有效解决这一问题，并且更加便捷。
没有清除浮动前：
清除浮动：
版权声明：本文为wsj2311161832原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接和本声明。