重溫css系列01_html/css

往往都在拼命的往終點狂奔，忽略了太多身邊的人和事了，需要我們靜下來，重新整理一下自己的思緒，勿忘初衷！??2015-10-11（幫朋友搬家）

好，我們進入今天的主題 重新整理一下css中一些容易忽略的問題

1.css盒子模型

    hello word hello word 

2.定位相關

  A A - 1 A - 2

一些的position小知識

1）應用了position: relative/absolute的元素，margin屬性仍然有效，以position:relative來舉例。

如果設置了left、top、bottom、right的屬性，建議大家不要設置margin數據，因為很難精確元素的定位，盡量減少干擾因素。

2）position: absolute忽略根元素的padding。

3）在IE6/7中設置position屬性后會導致z-index屬性失效

4）行內元素在應用了position：absolute之后會改變display。

因此，要注意到relative是并沒有改變行內元素的呈現模式，而absolute是會改變行內元素的呈現模式，如果設置了absolute并不需要顯式的的將元素display改成block。

5）應用了position: absolute / relative之后，會覆蓋其他非定位元素（即position為static的元素），如果你不想覆蓋到其他元素，也可以將z-index設置成-1。

Fixed

在很長的時間里，這個屬性值因為兼容性問題，并沒有得到非常廣泛的應用（IE6未實現該屬性值）。fixed和absolute有很多共同點：

1. 會改變行內元素的呈現模式，使display之變更為block。
2. 會讓元素脫離普通流，不占據空間。
3. 默認會覆蓋到非定位元素上。

fixed與absolute最大的區別在于：absolute的”根元素“是可以被設置的，而fixed則其”根元素“固定為瀏覽器窗口。即當你滾動網頁，其元素與瀏覽器窗口之間的距離是恒定不變的。

具體的列子可以參考：

3.選擇器

首頁框架布局結構展示：

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com