1.定位流分類
1.1相對定位
1.2絕對定位
1.3固定定位
1.4靜態定位（預設情況下元素就是靜態定位）
2.什麼是相對定位？
相對於自己在原來標準流中的位置進行移動
格式：position: relative;
top: 20px;
left: 20px;
3.相對定位注意點
3.1相對定位是不脫離標準流的，會繼續在標準流中占有一部分空間
3.2在相對定位中同乙個方向上的定位屬性只能使用乙個
3.3由於我們的相對路徑是不脫離標準流的，所以在相對定位中是區分塊級元素/行內元素/行內塊級元素的
3.4由於相對定位是不脫離標準流的，所以相對定位的元素會占用標準流中的位置，
所以當給相對定位的元素設定margin/padding等屬性的時候會影響到標準流的布局。
4.相對定位的應用場景
4.1用於對元素進行微調
4.2配合後面學習的絕對定位來使用
1.什麼是絕對定位？
絕對定位就是相對於body來定位的
2.絕對定位的注意點
2.1絕對定位的元素是脫離標準流的
2.2絕對定位的元素是不區分塊級元素和行內元素/行內塊級元素的
3.絕對定位參考點
規律1.預設情況下所有的絕對定位的元素，無論有沒有祖先元，都會以body作為參考點
2.如果乙個絕對定位的元素有祖先元素，並且祖先元素也是定位流，
那麼這個絕對定位的元素就會以定位流那個祖先元素作為參考點
2.1只要是這個絕對定位元素的祖先元素都可以
2.2這裡的定位流指絕對定位/相對定位/固定定位
2.3定位流中只有靜態定位不行
3.如果乙個絕對定位的元素有祖先元素，並且祖先元素也是定位流，
而且祖先元素中有多個元素都是定位流，
那麼這個絕對定位的元素會以離它最近的那個定位流的祖先元素為參考點
4.絕對定位注意點
1.如果乙個絕對定位的元素是以body作為參考點，
那麼其實是以網頁眉屏的寬度和高度作為參考點，
而不是整個網頁的寬度和高度作為參考點
2.乙個絕對定位的元素會忽略祖先元素的padding
html
>
<
html
lang="en">
<
head
>
<
meta
charset="utf-8">
<
title
>
絕對定位
-子絕父相
title
>
<
style
>*ul
ul li
ul li
:nth-of-type(4
)ul li img
style
>
head
>
<
body
>
<
ul>
<
li>
服裝城li
>
<
li>
美妝館li
>
<
li>
京東超市
li>
<
li>
全球購<
img
src="../images/hot.png"alt="">
li>
<
li>
閃購li
>
<
li>
**li
>
<
li>
拍賣li
>
<
li>
金融li
>
ul>
body
>
html
>
1.什麼是固定定位？
固定定位和前面學習的背景關聯方式很像
背景關聯可以讓背景不隨滾動條的滾動而滾動
而固定定位可以讓某個盒子不隨滾動條的滾動而滾動
注意點：
1.固定定位的元素時脫離標準流的，不會占用標準流的空間的
2.固定定位和絕對定位一樣，不區分行內/塊級/行內塊級元素
3.ie6瀏覽器不支援固定定位
1.什麼是z-index屬性？
預設情況下所有的元素都有乙個預設的z-index屬性取值是0.
z-index屬性的作用是專門用於控制定位流元素的覆蓋關係的
1.預設情況下定位流的元素會覆蓋住標準流的元素
2.預設情況下定位流元素後面編寫的元素會蓋住前面編寫的
3.如果定位流的元素設定了z-index屬性，那麼誰的z-inde屬性比較大，誰就顯示在上面
注意點：
1.從父現象
1.1如果兩個元素的父元素都沒有設定z-index屬性，那麼誰的z-index屬性大誰就顯示在上面
1.2如果兩個元素的父元素設定了z-index屬性，那麼子元素的z-index屬性就會失效，
也就是說誰的z-index屬性比較大誰就會顯示在上面
HTML5前端開發入門之CSS浮動流
1.什麼是浮動元素的脫標？脫標 脫離標準流 當某乙個元素脫標以後，那麼這個元素看上去就像被從標準流中刪除了一樣，這個就是浮動元素的脫標 2.浮動元素脫標之後會有什麼影響？如果前面乙個元素浮動了，而後面乙個元素沒有浮動，那麼這個時候前面的乙個元素就會蓋住後面的乙個元素 1.浮動元素排序規則 1.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...