一、什么是浮動
浮動可有三種取值，float:left/right/none，默認為none
浮：漂浮起來脫離文檔流，動：朝着指定方向移動
元素加了浮動后，會脫離文檔流，提升了半層層級，向着指定方向移動，直到遇到父元素的邊界或另一個浮動元素停止
Q1：什么是層級？
A1：如果將整個元素看做一層，則下半層是元素本身（背景樣式等），上半層是元素中的內容
舉例：
三個盒子都沒有浮動時
當給box2添加float:left時，三個盒子的排列變成
此時由於box2浮動脫離了文檔流，box3上移，被box2遮擋了。
但此時box3盒子里的文字box3並沒有上移！！！
原因：上文中有說到，浮動其實是提升了半層層級，那么此時box2的層級可以遮擋box3的小半層（背景樣式等），但此時box2的層級其實和box3的上半層（元素中的內容）在同一層級，因此，文字box3不會上移。
當增加box4,給box2和box4都添加float:left時
Q2：為什么box4沒有排在box2后面，而是排在了非浮動元素box3的底部之后？
A2：浮動元素之間是漂浮着，並不會形成一個流。浮動元素總是要保證自己的頂部與上一個標准流中的元素（未浮動元素）的底部對齊。
Q3：行類元素（span等）在浮動后為什么可以給寬高？
A3：position：absolute和float會隱式地改變display類型，除display:none外，只要設置了position：absolute或float，都會讓元素以display:inline-block的方式顯示，可以設置長寬
二、清除浮動
2.1.浮動的缺陷
1.影響兄弟元素的位置
2.使父元素產生高度塌陷
2.2.CSS中清除浮動的屬性：clear
2.3.清除浮動的方法及優缺點
后面再補充
2.4.清除浮動的實質
上述清除浮動方法可以分為兩種
1.利用css的clear屬性，加clear:both
2.觸發浮動元素父元素的BFC，使該父元素可以包含浮動元素