float: none | left | right | inherit
none:預設值，即不浮動
left：向頁面的左側浮動
right：向頁面的右側浮動
inherit：繼承父元素的float值（一般不建議使用inherit，ie不支援這個選項）
重點：1、對於塊級元素來說，在不設定寬度的情況系，預設的寬度是100%，一旦設定了浮動，它的寬度就會根據內容進行自動調整。
2、設定了浮動的元素會脫離正常的文件流，我們可以這樣理解：設定浮動後，元素不僅在y軸上浮動起來，在z軸上，也浮動起來。預設情況下，父元素的高度會根據子元素的內容進行調整，而如果我們將子元素設定為浮動，父元素的高度就會變為0。
3、雖然浮動的元素脫離了文件流，但是裡面的內容仍然佔據空間，會根據相對位置進行布局。
這裡舉個例子：
doctype html
>
<
html
>
<
head
>
<
meta
charset
="utf-8"
>
<
title
>float
title
>
<
style
type
="text/css"
>
.div_float
.div_none
style
>
head
>
<
div
class
="div_float"
>div_float
div>
<
div
class
="div_none"
>div_none
div>
body
>
html
>
效果：
浮動 清除浮動 盒子布局
div table,td table,td 單獨設定表的左和上邊框,然後設定td的右和下邊框,也可以避免重複問題 table td.a aa hover ddiv div a1.a2 sup sub father big small footer clear father big small foo...
高階布局 浮動 清浮動
文件流 normal flow bfc block fromatting context 塊級格式化上下文,它是乙個獨立的渲染區域,只有block level box參與,它規定了內部的block level box如何布局,並且與這個區域外部毫不相干.bfc規則 1.內部的box會在垂直方向,乙個...
css浮動布局
float 是 css 的定位屬性。在傳統的印刷布局中，文字可以按照需要圍繞。一般把這種方式稱為 文字環繞 在網頁設計中，應用了css的float屬性的頁面元素就像在印刷布局裡面的被文字包圍的一樣。浮動的元素仍然是網頁流的一部分。這與使用絕對 定位的頁面元素相比是乙個明顯的不同。絕對定位的頁面元素被...