块元素在文档流中默认从上至下排列，若希望块元素在页面中水平排列，可以使块元素脱离文档流。

使用float来设置元素的浮动

可选值：
none：元素默认在文档流中排列（默认值）
left：元素会立即脱离文档流，向页面的左侧浮动
right：元素会立即脱离文档流，向页面的右侧浮动

浮动的特点

• 当为元素设置浮动以后（float属性是一个非none的值），元素会立即脱离文档流，元素脱离文档流以后，它下面的元素会立即向上移动。
  
  
• 元素浮动以后，会尽量向页面的左上或右上漂浮，直到父元素的边框处或其他浮动元素为止。
  
  
• 如果浮动元素上面有一个没有浮动的块元素，则浮动元素不会超过块元素。
  
  
• 浮动的元素不会超过它上面的兄弟元素，顶多平齐。
  
  
• 浮动的元素不会盖住文字，文字会自动环绕在浮动元素的周围，所以我们可以通过浮动来设置文字环绕的效果。
  如图-1所示：

• 当元素设置浮动以后，会完全脱离文档流。
  • 块元素脱离文档流之后，宽度和高度都被内容撑开，而不再占据父元素的全部。（在文档流中，块元素的宽度默认占父元素的全部。）
  • 内联元素脱离文档流之后，会变成块元素。

如发现错误请联系我，谢谢你。
本文链接：http://ninefire.tk/HTML&CSS.basics/42.html