为什么要清除浮动以及清除浮动的方法

清除浮动

我们为什么要清除浮动？

如果对子元素都使用浮动会造成父元素的塌陷，不能填充父元素，即不能撑开父元素，这时候就需要清除浮动。

（1）清除浮动的clear属性

clear:属性值;
​
其属性值如下：
left    /*清除左浮动*/
right   /*清除右浮动*/
both    /*同时清除前面的左右浮动*/

（2）清除浮动的方法

• 使用伪元素清除浮动

  /* 为所要清除浮动的父级添加一个 clearfix 类  */
  .clearfix::after{
       content: "";
       display: block;
       clear: both;
  }

• 父级 div 定义 overflow:hidden

• 对浮动元素父级手动设置合适的高度

  只要浮动在一个有高度的盒子中,那么这个浮动就不会影响后面的浮动元素.所以就是清除浮动带来的影响了.

• 在父级中添加一个子级 空div 并对该div设置 属性

  clear：both