1.什麼是浮動元素的脫標？
脫標：脫離標準流
當某乙個元素脫標以後，那麼這個元素看上去就像被從標準流中刪除了一樣，這個就是浮動元素的脫標
2.浮動元素脫標之後會有什麼影響？
如果前面乙個元素浮動了，而後面乙個元素沒有浮動，
那麼這個時候前面的乙個元素就會蓋住後面的乙個元素
1.浮動元素排序規則
1.1相同方向上的浮動元素，先浮動的元素會顯示在前面，後浮動的元素會顯示在後面
1.2不同方向上的浮動元素，左浮動就會找左浮動，右浮動會找右浮動
1.3浮動元素浮動之後的位置，由浮動元素浮動之前在標準流中的位置來確定
1.如果父元素的寬度足夠顯示所有浮動元素，
那麼浮動的元素就會併排顯示
2.如果父元素的寬度不能顯示所有浮動元素，
那麼會從最後乙個元素開始往前貼靠
3.如果貼靠了前面所有浮動元素之後都不能顯示，
最終會貼靠到父元素的左邊或者右邊
1.在標準流中內容的高度可以撐起父元素的高度
2.在浮動流中，浮動的元素是不可以撐起父元素的高度的
1.清除浮動的方式一
給前面乙個父級元素設定高度
注意點：
在企業開發中，我們能不寫高度就不寫高度，
所以這種方式用的很少
2.清除浮動元素方式二
給後面的盒子新增clear屬性
clear屬性取值：
none：預設取值，按照浮動元素的排序規則來排序
left：就是告訴瀏覽器當前的浮動元素不要找前面的左浮動元素
right：不要找前面的右浮動元素
both：不要找前面的左浮動元素和右浮動元素(企業開發中一般都使用這個屬性)
注意點：
當我們給某個元素新增clear屬性之後，那麼這個屬性的margin屬性就會失效
3.清除浮動元素方式三（隔牆法）
3.1外牆法
在兩個盒子中間新增乙個額外的塊級元素
給這個額外新增的塊級元素設定clear：both;屬性
注意點:
外牆法可以讓第二個盒子使用margin-top屬性
但是第乙個盒子無法使用margin-bottom屬性
3.2內牆法
在第乙個盒子中所有子元素最後新增乙個額外的塊級元素
給這個額外新增的塊級元素設定clear：both;屬性
注意點：
內牆法可以讓第二個盒子使用margin-top屬性
而且第乙個盒子也可以使用margin-bottom屬性
3.3兩者之間的區別
外牆法不能撐起第乙個盒子的高度，而內牆法可以撐起第乙個盒子的高度
在企業開發中基本不使用這個隔牆法方式來清除浮動元素
4.清除浮動的方式四（偽元素選擇器法）
通過偽元素選擇器為第乙個盒子新增子元素，這樣就和內牆法的原理相同，企業開發一般使用這個方法
.box1::after
.box1
注意點：
ie6中不支援這種方式，為了相容ie6必須給前面盒子新增*zoom：1;屬性
什麼是偽元素選擇器？
偽元素選擇器作用就是給指定標籤的內容前面新增乙個子元素
或者給指定標籤的內容後面新增乙個子元素
格式:div::before
給指定標籤前面新增子元素
div::after
給指定標籤後面新增子元素
例如:content:"麼麼噠"; == 指定新增的子元素中儲存的內容
visibility:hidden; == 隱藏新增的子元素
5.清除浮動的方式五
1.overflow：hidden;作用
1.1可以將超出標籤範圍的內容裁剪掉
1.2清除浮動,給第乙個盒子新增overflow：hidden;屬性即可
注意點：ie6中不支援這種方式，為了相容ie6必須給前面盒子新增*zoom：1;屬性
1.3可以通過overflow：hidden;屬性讓裡面的盒子設定margin-top之後，外面的盒子不被頂下來
HTML5前端開發入門之CSS定位流
1.定位流分類 1.1相對定位 1.2絕對定位 1.3固定定位 1.4靜態定位 預設情況下元素就是靜態定位 2.什麼是相對定位？相對於自己在原來標準流中的位置進行移動 格式 position relative top 20px left 20px 3.相對定位注意點 3.1相對定位是不脫離標準流的，...
HTML5前端開發入門之video audio標籤
1.什麼是video標籤？格式1 video 標籤的屬性 srcautoplay controls 用於告訴video標籤是否需要控制條 poster loop preload muted 靜音 width 寬度 height 高度 格式2 這個時候w3c未了解決這個問題，所以推出了第二個video...
HTML5前端開發入門之CSS文字屬性
1.規定文字樣式的屬性 格式 font style italic 取值 normal 正常的，預設是正常的 italic 傾斜的 快捷鍵 fs tab鍵 font style italic fsn tab鍵 font style normal 2.規定文字粗細的屬性 格式 font weight b...