定位方式+偏移：
static：所有不設定定位的元素，定位方式都是static（預設）
1.不脫離標準流
2.偏移不起作用：top right bottom left
3.消除定位（實戰中的應用）
relative：相對定位
1.不脫離標準流
2.偏移起作用：top right bottom left, 起始點從元素本來應該所在的位置的左上點
3.不破壞標準流，把元素移動到需要的地方
4.relative+偏移 vs static+margin的區別？
a. relative只是移動了元素，但是標準流不受影響；
b.margin雖然也滿足移動元素，但是會影響標準流
5.relative作為absolute的基準
6.如果同時設定了left和right，只有left有效；如果同時設定了top和bottom，只有top有效（和定義在先或者在後沒有關係）。
/*用position: relative;的效果*/
/*用margin的效果*/
/*同時設定left和right的效果：left: 100px; right: 50px;*/
absolute: 絕對定位
1.脫離標準流，跟著滾動條一起滾動
2.偏移起作用:top right bottom left
a. 沒有任何一層的祖先節點有定位（如relative，absolute，fixed），以瀏覽器的可視區為起始點
*****==執行後的效果，備註：紅色的塊之所以有空白，那是body對應的margin*****====
如果設定body的話，可以比較容易的看出是脫離了body的：
b.父元素有定位（relative，absolute，fixed），以父元素的內角（border和padding的分界線）為起始點；margin對子元素定位有影響，padding, border對子元素定位沒有影響
*****====執行的結果**********
**********==如果給父元素加margin的話***************
.father
**********==如果給父元素加padding的話***************
.father
效果和上圖一樣，也就是說padding未生效
c.如果有乙個或者多個祖先元素有定位（relative，absolute，fixed），以最近的祖先元素的內角（border和padding的分界線）為起始點
/*第一種：.father和.grand-father都設定position: relative;則以.father為起始點*/
/*第二種：.father設定position: relative, .grand-father不設定position: relative;仍然以.father為起始點*/
執行效果和上圖一樣
/*第三種：.father不設定position: relative, .grand-father設定position: relative;則以.grand-father
為起始點*/
3.設定了position: absolute, 沒有設定left，top：
a. 如果沒有設定left和top，所有對元素能產生作用的因素全都起作用（就好像沒有設定absolute一樣的效果）：注意，與top: 0; left: 0; 不等價，不設定left和top的情況，left和top被初始化為「應該在「（按標準流去算下位置，但是卻脫離標準流）的位置。
********************====效果*************************==
b.如果left被設定，top沒有：left按照設定，top按照「應該在」的位置
**********執行效果*****====
c.如果top被設定，left沒有：top按照設定，left按照「應該在」的位置
效果和b相似
4.relative作為absolute的基準（父r子a）
abcde
將.father設定成position: absolute;的效果：
將.father設定成position: relative;的效果（不會影響下面的div的布局）：
CSS樣式（四） CSS定位
css定位 positioning 屬性 允許定義元素框相對於其正常位置應該改出現的位置，或者相對于父元素 另乙個元素甚至瀏覽器視窗本身的位置。一切皆為框 1 塊級元素 div h1或p標籤 即 顯示為一塊內容稱之為 塊框 2 行內元素 span,strong,a等元素 即 內容顯示在行中稱 行內框...
CSS樣式的定位
當元素沒有position定位屬性時，所有元素按照他們自己的定位標準進行定位，比如說 每乙個div標籤就佔一行。但是當元素我有了position屬性，那麼div原先占有一行的屬性就被覆蓋掉了 可以說沒有用了 例 控制代碼1控制代碼2 containr 控制代碼控制代碼cont 結果 現在來看看abs...
前端攻城獅 css樣式之定位
為什麼要學習定位呢？因為很重要。ps 這不是廢話嘛 這樣子把，假如說我們需要在乙個盒子裡居中顯示乙個小盒子，那麼就是需要定位來坐，定位用的頻率還是非常高的。css定位分為三種 絕對定位 相對定位 固定定位。各位看官不要急，聽我一一道來。相對定位 position relative 相對定位相對誰？相...