left：元素向左浮動。
right：元素向右浮動。
none：預設值。元素不浮動，並會顯示在其在文字中出現的位置。
浮動的特性：
浮動元素會從普通文件流中脫離，但浮動元素影響的不僅是自己，它會影響周圍的元素對齊進行環繞。
不管乙個元素是行內元素還是塊級元素，如果被設定了浮動，那浮動元素會生成乙個塊級框，可以設定它的width和height，因此float常常用於製作橫向配列的選單，可以設定大小並且橫向排列。
浮動元素的展示在不同情況下會有不同的規則：
浮動元素在浮動的時候，其margin不會超過包含塊的padding。ps：如果想要元素超出，可以設定margin屬性
如果兩個元素乙個向左浮動，乙個向右浮動，左浮動元素的marginright不會和右浮動元素的marginleft相鄰。
如果有多個浮動元素，浮動元素會按順序排下來而不會發生重疊的現象。
如果有多個浮動元素，後面的元素高度不會超過前面的元素，並且不會超過包含塊。
如果有非浮動元素和浮動元素同時存在，並且非浮動元素在前，則浮動元素不會高於非浮動元素
浮動元素會盡可能地向頂端對齊、向左或向右對齊
重疊問題
行內元素與浮動元素發生重疊，其邊框，背景和內容都會顯示在浮動元素之上
塊級元素與浮動元素發生重疊時，邊框和背景會顯示在浮動元素之下，內容會顯示在浮動元素之上
clear屬性
clear屬性：確保當前元素的左右兩側不會有浮動元素。clear只對元素本身的布局起作用。
取值：left、right、both
**`父元素高度塌陷問題`**解決父元素高度塌陷問題：乙個塊級元素如果沒有設定height，其height是由子元素撐開的。對子元素使用了浮動之後，子元素會脫離標準文件流，也就是說，父級元素中沒有內容可以撐開其高度，這樣父級元素的height就會被忽略，這就是所謂的高度塌陷。
3.3 清除浮動的方法方法1：給父級div定義 高度方法二：使用空元素，如div> (.clear)優點：瀏覽器支援好
缺點：多出了很多空的div標籤，如果頁面中浮動模組多的話，就會出現很多的空置div了，這樣感覺視乎不是太令人滿意。（不推薦使用）
方法三：讓父級div 也一併浮起來方法四：父級div定義 display:table方法五：父元素設定 overflow：hidden、auto；優點：**簡介，不存在結構和語義化問題
缺點：無法顯示需要溢位的元素（亦不太推薦使用）
方法六：父級div定義 偽類:after 和 zoom.clearfix
原理：ie8以上和非ie瀏覽器才支援:after，原理和方法2有點類似，zoom(ie轉有屬性)可解決ie6,ie7浮動問題
優點：結構和語義化完全正確,**量也適中，可重複利用率（建議定義公共類）
缺點：**不是非常簡潔（極力推薦使用）
經益求精寫法
.clearfix:after
.clearfix 照顧ie6，ie7就可以了
詳細關於浮動的知識請參看這篇文章：
浮動與清除浮動
為元素設定了浮動之後，元素就會脫離文件流 可以看做是漂浮在文件流之上 存在。所有產生了浮動流的元素，塊級元素看不到它們。產生了bfc的元素和文字類屬性 inline 的元素以及文字都能看到浮動元素。如何觸發乙個盒子的bfc？position absolute float left right dis...
浮動與清除浮動
浮動布局是一種常見的布局方式，最初的使用目的是進行 的混排 清除浮動 浮動的使用場景 浮動通過css定義 div1 浮動可以取的值 none 預設 left right 當元素進行左浮動或者右浮動之後會脫離文件流，並且構成乙個浮動流，會覆蓋在沒有浮動的元素上，並且允許文字和內聯元素環繞在它周圍 浮動...
浮動與清除浮動
浮動與清除浮動 也成了建立多欄布局最簡單的方式。文字內容段落內容文字內容段落內容文字內容段落內容文字內容段落內容文字內容段落內容 文字繞排 p img 建立多欄布局 p img 二 浮動元素脫離了文件流，其父元素也看不到他了，因為也不會包圍他，就會出現子元素有高度，而父元素不會被撐起，這時候並非我們...