《CSS權威指南》筆記


h1{} 0,0,0,1
p em{} 0,0,2
.grape{} 0,0,1,0
p.bright em.dark{} 0,0,2,2
#id123{} 0,1,0,0
其中#id123{} 0,1,0,0優先順序最高..
複製**

定位可以準確的定義元素框相對於其正常位置應該出現在**，或者相對于父元素，另乙個元素甚至瀏覽器位置。

定位有5個值:static ,relative,absolute,fixed,inhert.其中static為預設值,relative為相對定位，absolute為絕對定位，fixed為固定定位。

relative：元素框偏移某個位置，元素仍保持其未定位前的形狀，它原本所佔的空間保留。absolute:從文件流中被刪除，並相對於其包含塊定位。在文件流中刪除並且生成乙個包含其內容的塊級框。fixed，與絕對定位類似，不過其包含塊是視窗本身，同樣在文件流中刪除並生成乙個包含其內容的塊級框。

fixed：元素框表現類似於position設定為absolute,不過其包含塊是視窗本身。

包含塊定義:

定位採用了top,left,right,bottom來偏移其相對於包含塊的位置。top和bottom相對於包含塊的高度，left,right相對於包含塊的寬度。

如果設定了absolute，四個偏移值同時可以設定該元素的寬高，例如設定了left和right，那麼元素的寬度就是right-left.如果設定了top和bottom,那麼元素的高度就是bottom-top。

由於預設的包含塊定位值是static,所以該包含塊不是設定了absolute的實際包含塊，所以如果想要設定為absolute的包含塊的話，那麼該包含塊需要設定為非static值.

可以通過visibility控制元素的可見性。有三個值，visible、hidden、collapse。其中hidden將使該元素不可見，但是該元素還是存在於文件流中並保持位置。

元素覆蓋順序。可以通過z-index更改定位元素之間的覆蓋順序，注意這裡需要設定了relative、fixed,absolute定位才可使用z-index屬性。有較高z-index屬性值的元素會覆蓋掉該值較低元素。