相信每個初學html5的童鞋都或多或少的對float浮動這一屬性迷茫過，下面讓我來為大家列舉一下關於浮動的特性。
一、浮動元素會脫離文件流
何為脫離文件流？假設我們在紙上寫字，每一個字代表一個元素，我們讓其中的一個字原地漂浮起來，那麼我們會說這個字脫離了原先的位置，即脫離了文件。當我們給一個元素加入float屬性時，它就跟字一樣脫離了原先的位置，不再佔用原本的位置，原本的位置便會空出來，假設有一個我們沒有設定寬高屬性的div，其中包含著一個元素，div在不設定高屬性時，高預設是由內容撐出來，當我們給其內部的元素加入浮動屬性時，元素便會脫離文件流，不在佔div內部的位置，這時候div的高便沒有了，這也是為什麼要清浮動原因。
二、讓行內元素可以支援寬高設定
我們知道行內元素是不支援寬高設定的，當然我們可以加display：inline-block；或display：block；來使行內元素支援寬高設定，float屬性也可以使行內元素支援寬高設定。
三、讓塊元素可以在同一行排列
塊元素是獨佔一行的，像div，每個塊元素預設是獨佔一行，這跟塊元素寬度的大小沒關係，所以不要想著設定寬度可以讓兩個塊元素在同一行顯示，除非加上display：inline-block；屬性，這時候給兩個塊元素同時加上浮動屬性就可以讓它們在同一行顯示了。
四、寬高預設由內容撐出來
這一個好理解，加入浮動屬性時，我們不給它設定寬高的話，寬高預設由裡面的內容撐出來。
五、一個元素設定浮動屬性之後，該元素會像著設定的方向移動，直到碰到父級或瀏覽器的邊緣，或者前一個浮動元素，就會停止浮動
浮動、浮動，有浮便會有動，float-left：向左浮動；float-right：向右浮動；浮動的元素迴向著所設定的方向移動，直到碰到前一個浮動元素，便會緊挨著前一個浮動元素停下，這也是浮動屬性可以讓塊元素在同一行顯示的原因。當該元素前面沒有浮動元素時，便會繼續移動直到碰到父級，然後緊挨父級停下，如果父級也沒有，便會移動到緊貼瀏覽器時停下。
六、浮動元素的層級比正常塊元素的層級高
當一個元素浮動時，它的層級會比沒有浮動的塊元素的層級高，這也是浮動元素會覆蓋前一個沒有浮動的塊元素的原因。
七、浮動元素不會覆蓋文字或行內標籤，只會覆蓋元素或者有塊元素特徵的元素的邊框和背景，所有文字或行內標籤會圍繞浮動元素顯示。
關於浮動的那些事
最近在學做網頁，都快把我逼瘋了，寫的亂哄哄的，哎，自己都嫌棄。今天我又看了關於css中浮動的知識，那下面我就談談我現在對浮動的理解吧。浮動 float 是指設定了浮動屬性的元素會脫離標準普通流的控制而移到指定的位置。也就是說，它能讓元素向左向右移動，而一個浮動的元素會盡量向左或向右移動，直到它的外邊...
CSS那些事 浮動
塊元素在頁面中預設是上下排列，根據我們排版佈局需要會使用float浮動這一屬性橫向排列布局。我最早認識浮動float這一屬性是學習css佈局的時候，那時對於浮動的第一認識是給上下排列的元素新增這個屬性時會讓上下排列的元素橫向排列，從而達到想要的效果。隨著後面逐步的學習，我對float這個屬性有了更加...
CSS之浮動那些事
1.清除浮動 下面是兩種常用的方式，而這兩招也夠用了 不用千招會，只需一招精 1.結尾處加空div標籤 clear both style type text css left right 清除浮動 clearfloat style div div class left left div div cl...