float元素也稱為浮動元素，設定了float屬性的元素會根據屬性值向左或向右浮動。浮動元素會從普通文件流中脫離，但浮動元素影響的不僅是自己，它會影響周圍的元素對齊進行環繞。簡單來說，就是讓block元素無視float元素，讓inline元素讓流水一樣圍繞著float元素來實現浮動布局。
1、背景不能顯示
由於浮動產生，如果對父級設定了（css background背景）css背景顏色或css背景，而父級不能被撐開，所以導致css背景不能顯示。
2、邊框不能撐開
如上圖中，如果父級設定了css邊框屬性（css border），由於子級裡使用了float屬性，產生浮動，父級不能被撐開，導致邊框不能隨內容而被撐開。
3、margin padding設定值不能正確顯示
由於浮動導致父級子級之間設定了css padding、css margin屬性的值不能正確表達。特別是上下邊的padding和margin不能正確顯示。
1、對父級設定適合css高度
對父級設定適合高度樣式清除浮動，這裡對父元素設定一定高度即可，一般設定高度需要能確定內容高度才能設定。
使用設定高度樣式，清除浮動產生，前提是物件內容高度要能確定並能計算好。
2、clear:both清除浮動
為了統一樣式，我們新建乙個樣式選擇器css命名為「.clear」，並且對應選擇器樣式為「clear:both」，然後我們在父級「」結束前加此div引入「class=「clear」」樣式。這樣即可清除浮動。
.clear
對父級css選擇器加overflow:hidden樣式，可以清除父級內使用float產生浮動。優點是可以很少css**即可解決浮動產生。
.father
.clearfix::after
浮動和清除浮動
浮動的框可以向左或向右移動，直到他的外邊緣碰到包含框或另乙個浮動框的邊框為止。由於浮動框不在文件的普通流中，所以文件的普通流的塊框表現得就像浮動框不存在一樣。浮動的塊框會漂浮在文件普通流的塊框上。浮動元素引起的問題 1 父元素的高度無法被撐開，影響與父元素同級的元素。2 與浮動元素同級的非浮動元素 ...
浮動和清除浮動
浮動的框可以向左或向右移動，直到它的外邊緣碰到包含框或另乙個浮動框的邊框為止。由於浮動框不在文件的普通流中，所以文件的普通流中的塊框表現得就像浮動框不存在一樣。如果包含框太窄，無法容納水平排列的三個浮動元素，那麼其它浮動塊向下移動，直到有足夠的空間。如果浮動元素的高度不同，那麼當它們向下移動時可能被...
CSS float 浮動屬性
本篇主要介紹float屬性 定義元素朝哪個方向浮動。1.頁面布局方式 介紹文件流 浮動層以及float屬性。2.float left 介紹float為 left 時的布局方式。3.float right 介紹float為 right 時的布局方式。4.相鄰元素含有float屬性 介紹相鄰元素含有fl...