CSS浮动属性（Float）

什么是CSS Float（浮动）

CSS的Float（浮动）属性，会让元素位置移动，可以向左或向右移动，被移动元素的周围元素位置也会重新排列。

由于块状元素具有自上而下的显示顺序，使得Float（浮动）在布局时十分有用，经常用在图像上。即上下排列的元素，可以并排显示。

元素的浮动方式

元素可以进行水平方向的浮动，向左或是向右，并不能进行垂直方向的移动。

浮动元素进行移动时会尽可能向左（右）移动，直到遇到边框（border）、填充值（padding）、外边界（margin）或者另一个块元素为止。

写在浮动元素之后的元素将围绕浮动元素，而之前的元素并不会受到影响。可以认为：元素添加浮动之后，就上浮起来，原本在标准文档流中所占的位置就不再占有了，后面的内容会把位置补上去。

例：图像向右浮动，写在图像后面的文本将环绕在图像的左侧。

代码（向右浮动）：
img
{
float：right；
}

相应的，向左浮动的代码则为：
float：left；

使用代码表示元素没有浮动属性时，可以：
float：none；

此外，添加了浮动属性之后的元素，将不再具有我们常用的 margin：0 auto；属性。

相邻的浮动元素

几个浮动的元素，如果放在一起，空间足够的话，它们将彼此相邻。

如果想要将N个元素在一排并列显示，那么N个元素都需要添加浮动属性。

浮动之后的排版顺序是跟HTML标签属性顺序有关的。