總結：
1 . position:absolute; 他的意思是絕對定位，預設上溯父級元素，找第乙個不是 static 的元素，以其為 absolute 的基準。如果設定trbl並且父級沒有設定position屬性，那麼當前的absolute則以瀏覽器左上角為原始點進行定位，位置將由trbl決定。
2 . position:relative ; 參考自身靜態位置通過 top,bottom,left,right 定位
3 . relative 是無侵入定位，即在相對定位中，雖然表現區脫離了原來的文字流，但是仍佔據原來位置空間（可應用於拖拽）
4 . relative如果設定對立屬性，如left/right，top/bottom，left和top優先（絕對定位是拉伸，相對定位是鬥爭）
5 .relative 可以提高層疊上下文：當網頁中兩個元素有重疊關係時，一般是dom流後面出現的元素覆蓋前面的，但是position:relative 可以把被覆蓋的元素提高層疊次序
6 . 當relative設定z-index時，就會新建層疊上下文，z-index值高的元素，自身及子元素的層疊次序都會上公升；z-index值為0時，內部元素就自由了，relative不再對內部z-index做限制（ie6，7除外）
relative的最小化影響準則：
即，如何盡量降低relative屬性對其他元素或布局的潛在影響！
1 .盡量不使用relative
absolute定位不依賴relative，可以直接position:absolute脫離文件流之後用margin進行偏移
如：不需要父容器設定position:relative，也可以讓子容器定位在頂部
class="container">
class="row">
class="col-xs-12">
aaadiv>
bbbdiv>
cccdiv>
div>
div>
2 .relative最小化
當需要定義在容器的右上角時，難以用上面方法完美實現，需要應用relative最小化原則：即對需要定位元素單獨放置在乙個空div裡，並只對這個最小父div設定position:relative
CSS深入理解之border
總結自慕課網 個人理解 width屬性具有繼承性，假設父元素100px 子元素設定50 則為50px 而border width不具有繼承性，如果使用百分比，瀏覽器解析時應該向誰作為參考物件呢，所以只能用指定大小來確定。類似不支援百分比的有 outline,border shadow,text sh...
深入理解css之line height
行高，顧名思義是一行文字的高度，而從規範上來說則是兩行文字基線之間的距離。行高是作用在每乙個行框盒子 line box 上的，而行框盒子則是由內聯盒子組成，因此，行高與內聯元素可以說是非常緊密，行高直接決定了內聯元素的高度 注意 這裡的內聯元素不包括替換元素 對於塊級元素和替換元素，行高是無法決定最...
CSS深入理解之float
float 屬性定義元素在哪個方向浮動。產生之初這個屬性總應用於影象，使文字圍繞在影象周圍，不過在 css 中，任何元素都可以浮動。浮動元素會生成乙個塊級框，而不論它本身是何種元素。如果浮動非替換元素，則要指定乙個明確的寬度 否則，它們會盡可能地窄。讓設定的標籤產生浮動效果，就是脫離原來頁面的標準輸...