CSS 規格與繼承

下面就是我的第二篇重點摘論：第三章 規格與繼承
============================================================
規格權重: ( 權重如果相同, 就要看優先順序, 越後面宣告的越大, 引用外部樣式表的將視為最早的宣告, 內部樣式 > 外部樣式 )

1. 被繼承的組件 規格= "無"(最小)
    *{ } 全域選取項 規格=0,0,0,0

2. 組件{ } 規格=0,0,0,1
    "+" , "空格" , ">"         規格=0,0,0,2

3. "[ ]", "."           規格=0,0,1,0
    "~=" 規格=0,0,1,"0 < ? < 1"
    組件.類別{ } 規格=0,0,1,1
    組件 組件.類別{ } 規格=0,0,1,2
    組件.類別 組件.類別{ } 規格=0,0,2,2

4. #id{ } 規格=0,1,0,0
   組件#id{ } 規格=0,1,0,1
   組件#id *[ ] 規格=0,1,1,1

5. 內崁樣式最大 規格=1,0,0,0
   〈h1 style="color:Blue;"〉

6. "權重最高者" Max
    組件{color:Red !important;}
    h1 style="color:Blue !important;"
    (必須要寫在規則宣告的結尾(color:Red !important;), 並在 ";" 前面)

權重比重:
           1. 使用者的重大宣告 !important
           2. 設計者的重大宣告 !important
           3. 設計者的正常宣告
           4. 使用者的正常宣告
           5. 使用者代理程式的宣告
           6. 瀏覽器的預設樣式  

============================================================

繼承:
1. 繼承的規格為 "無" , 只要有其他組件有宣告(含全域選取項) 皆會被覆蓋過去

2. 這種特性只會向後代傳播, 先代並不會有任何影響
   (下面的範例會連被包覆在裡面的 〈em〉 都會繼承 〈h1〉 的特性, 顏色將改為 "Gray")

h1{ color:Gray;}
      〈h1 id="page-title"〉Meerkat 〈em〉Central〈/em〉〈/h1〉

        只有一種情況會向上傳播, 就是 "body" 會傳導給根組件 html

3. 下面幾種特性都不會繼承:
1. margin 邊界
2. padding 邊距
3. backgroud 背景
4. border 邊框

============================================================

繼承之順序 " LVHA " :

1. 網頁黃金順序盡量要依此原則: link -> visited -> hover -> active
 
       (因為四個權重都一樣, 最晚出現的權重一定越大
        所以如果順序為 active -> link -> visited -> hover 
        active, hover 樣式就會失效, 因為每一個鏈結只屬於 "已瀏覽" 或 "未瀏覽")
           
        如果想要已鏈結不受影響, 其他皆為正常: link -> hover -> visited -> active

2. 網頁一但開過一次, 以後就一定會是 visited 的樣式, 所以有時候設定了 :link 但沒反應, 就是因為不小心先前已經開過一次的

3.
        :link
        :visited
        :link:hover
        :visited:hover
        :active
        :visited:active

- SC