div布局之float

浮动（float）是css布局非常强大的布局功能、也是理解css布局的关键问题所在。在css中，包括div在内的任何元素都可以以浮动的方式进行。

浮动时一种非常先进的布局方式，他能够改变页面中对象的前后流动键顺序，这样做的好处是使得内容的排版变的简单且有良好的伸缩性。例如右分栏的布局，左栏宽度为300px；如果我们使用一种相对式的布局方式，可以使邮栏显示在距左边300px的位置，这样使得右栏可以贴着左栏显示。

一旦设计被改变，例如float的宽度由300px改变为100px，就意味着right的定位需要重新设定。而使用浮动式布局方式，当我们指定了左栏的浮动为left，就意味着其右方的内容将能够流入到左栏的右边，而且能够根据左栏的宽度，自动流入并贴至左栏，而贴近的程度则由左栏的右边距或右栏的左边距来控制，不需要依赖对象本身的宽度值，浮动式布局使得页面的大部分内容都可以由浏览器来自动调试之间的关系，使我们能够专注于样式设计而非其相互之间的浮动关系，我们只需要简单地设置浮动方向便可以完成对象的布局分布。