浮动，清除浮动

[conan1992]

定义：

float CSS属性指定一个元素应沿其容器的左侧或右侧放置，允许文本和内联元素环绕它。该元素从网页的正常流动(文档流)中移除，尽管仍然保持部分的流动性（与绝对定位相反）。

优点：可以设置横向排序方向，浮动元素可以设置宽高，可以使文字和内联元素环绕；

缺点：脱离文档流，使得父级的高度塌陷；

清除浮动的方法

• 父级添加overflow属性，或者设置高度
• 添加额外标签

  <div class="parent">
  //添加额外标签并且添加clear属性
  <div style="clear:both"></div>
  //也可以加一个br标签
  </div>

• 伪类元素

  .clear:after{
  /* 设置添加子元素的内容是空 */
    content: '';  
    /* 设置添加子元素为块级元素 */
    display: block;
    /* 设置添加的子元素的高度0 */
    height: 0;
    /* 设置添加子元素看不见 */
    visibility: hidden;
    /* 设置clear：both */
    clear: both;
  }