“浮动元素的定位还是基于正常的文档流，然后从文档流中抽出并尽可能远的移动至左侧或者右侧。文字内容会围绕在浮动元素周围。当一个元素从正常文档流中抽出后，仍然在文档流中的其他元素将忽略该元素并填补他原先的空间。” [Float Positioning]
“元素浮动后将自动转为块级元素。该元素可以被移动至当前行的左侧或右侧。属性如下：float: left, float: right or float: none”[Floatutorial: Float Basics]
“你应该为所有的浮动元素设定宽度属性（除非是<img>元素，因其具有隐含的宽度）。如果不设定宽度，结果将是不可预知的。”[Floatutorial: Float Basics]
“举例来说，浮动元素应该定义宽度属性，不论是显式指定的还是隐含的。另外，它会尽可能的水平的填充容器元素，就像非浮动内容那样，不给其他内容空间以围绕它们。其次，和正常文档流中的元素不同，浮动元素的垂直边距(margin)不会叠加。最后，浮动元素可以和临近在正常文档流中块级元素重叠（译注：浮动元素不占任何正常文档流空间，所以建议不要理解成重叠，而是腾空浮动的概念。）。”[CSS Positioning: Floats]
“当我们让一个元素浮动，它会往右或者往左浮动直至遇到容器的边缘。如果我们向同一方向再浮动一个元素，它会浮动直至碰到前一个浮动元素的边缘。如果我们浮动更多的元素，他们将一个挨一个排列，但不久就会空间不足，当该行已经无法容纳更多的浮动元素，则下一个浮动元素会换行继续排列。” [Float Layouts]
“当明确指定时，浮动元素垂直位置由它原先在文档流中的位置决定，顶端与当前行顶端对其。但是水平方向上，它尽可能远的向容器元素边缘移动，但是仍遵循容器元素的填充距离(padding)。同行的行内元素则围绕浮动元素排列。”[CSS Positioning: Floats]
注：clear:both只能清除当前层级的float,外级的也同样需要加上clear:both来清楚。
例1：<div class="container">
<div id="A1" style='float:left'></div>
<div id="A2" style='float:left'></div>
<div id="clear" style='clear:both'></div>
<div id="A3" style='float:left'></div>
</div>
在同一个容器下，这里id='clear'只能让A3不在同一行，但是如果还有一个container的话就要在同级中写一个clear：both，看例2
例2：<div class="container">
<div id="A1" style='float:left'></div>
<div id="A2" style='float:left'></div>
<div id="clear" style='clear:both'></div>
<div id="A3" style='float:left'></div>
</div>
<div id="clear1" style='clear:both'></div> 这里加上可以清除，如果没有加这个的话否则B1的垂直位置将会与container1对齐，B1的水平位置紧接着A3后面
<div class="container1">
<div id="B1" style='float:left'></div>
</div>
即：A3因为float的关系浮动在container1上但是不会覆盖B1，B1水平位置紧接着A3后面
记住，浮动实际上并不是真正地被包含在一个块盒中，即使在源代码中是怎样嵌套的。请注意确认，浮动的屏幕开始点是由它所嵌套的位置决定的，之后它只是在容器盒上展开，就像绝对元素一项。只有包含行内元素的行盒（例如文本），才需要关注浮动在哪里被显示。
“任何浮动元素都不可能超过原来所处文档留位置的上边界。浮动元素的顶端必定和当前行顶端对齐（或者在没有当前行元素时和前一个块级元素底部边缘对齐）。”[Float Layouts]
“想要真正理解浮动理论，你必须明白在CSS中什么是行(line box)。不幸的是，为了解释什么是行，你必须先明白什么是行级元素。行级元素指的是那些非块级元素，例如 <em>。而行是一个逻辑上的概念，是一个虚拟的矩形，包含了组成该行的所有行级元素，其高度至少等于这些行级元素中最高的那个。” [Float Layouts]