浮动与脱离文档流的特点

• float 浮动
  通过浮动可以使元素脱离文档流，处于页面的上方。使元素水平排列，多用于水平布局
  • float的属性值：
    none  默认，不浮动
    left     向左侧浮动
    right   向右侧浮动
  • 知识点
    设置浮动后元素将从文档流中脱离，不占据文档流的位置。下面文档流中的元素会自动向上移动。
    设置浮动后元素可以向父元素左侧或右侧移动，但不会移出父元素的范围。
    当元素设置为浮动后，会自动添加在其上的其它浮动元素后面。
    当上面的元素没有浮动时，不会浮动到上面，会在下面浮动
    浮动元素不会超过前面的其它浮动兄弟元素，最多与它一样高。
• 脱离文档流的特点
  脱离文档流后不需要区分块元素和行内元素
  • 块元素
    块元素脱离文档流后，不在独占一行，宽度与高度根据内容自动撑开
    下方文档流中的文字会自动上升在块元素后面，块元素不会盖在文字上面，文字会环绕块元素排列
  • 行内元素
    行内元素脱离文档流后会具有块元素的特性，但不会独占一行