傳統網頁布局的三種方式
本質：用css擺放盒子。
實際開發中，乙個頁面基本都包含了這三種布局方式：
1、普通流（標準流/文件流）：最基本的布局方式
標籤按照規定好預設方式排列
浮動
float屬性用於建立浮動框，將其移動到一邊知道左邊緣或右邊緣觸及包含塊或另乙個浮動框的邊緣。
要想塊元素水平排列如果轉換成行內塊之間會有大的空白縫隙很難控制。
浮動可以改變元素標籤預設的排列方式。
網頁布局第一準則：多個塊級元素縱向排列找標準流，橫向找浮動。
浮動特性
加了浮動之後的元素會偶很多特性。
1、浮動元素會脫離標準流（脫標）
2、會一行內顯示並且元素頂部對齊
3、會具有行內塊元素的特性
4、浮動的盒子不會保留原先的位置
浮動元素經常和標準流父級搭配使用
為了約束浮動元素的位置，網頁布局一般採取的策略是：
先用標準流的父元素排列上下位置，之後內部子元素採取浮動排列左右位置。
網頁布局第二準則：先設定盒子大小，再設定盒子的位置。
1、浮動和標準流父盒子搭配
2、乙個元素浮動了，其他兄弟元素也要浮動。
3、浮動的盒子智慧型影響浮動盒子後面的標準流，不會影響前面。
為什麼要清除浮動
很多父盒子不方便給高度，讓子盒子撐開父親。但是子盒子浮動又不占有位置，最後父級盒子高度為0時，就會影響下面的標準流盒子。
清除浮動本質
CSS的浮動以及清除浮動
給元素新增了float屬性 float left,float right 可以讓元素進行橫向排列 做文字圍繞效果 因為文件流元素會忽視浮動元素的存在，但是文件流元素的文字卻不會。新增了float屬性後，該元素會脫離正常的文件流，所以會覆蓋其他的元素，父元素由於沒有被撐開，造成了高度塌陷。所以清除浮動...
CSS清除浮動 清除float浮動
css清除浮動方法集合 一般浮動是什麼情況呢？一般是乙個盒子裡使用了css float浮動屬性，導致父級物件盒子不能被撐開，這樣css float浮動就產生了。浮動產生樣式效果截圖 本來兩個黑色物件盒子是在紅色盒子內，因為對兩個黑色盒子使用了float浮動，所以兩個黑色盒子產生了浮動，導致紅色盒子不...
CSS清除浮動 清除float浮動
css清除浮動方法集合 一般浮動是什麼情況呢？一般是乙個盒子裡使用了css float浮動屬性，導致父級物件盒子不能被撐開，這樣css float浮動就產生了。浮動產生樣式效果截圖 本來兩個黑色物件盒子是在紅色盒子內，因為對兩個黑色盒子使用了float浮動，所以兩個黑色盒子產生了浮動，導致紅色盒子不...