參考連結(2018更新)： CSS Specificity 在複雜的頁面裡，HTML元素套用到互相衝突的CSS指定的情形並不少見 本篇文章會說明元素的CSS指定來源以及設定的優先順序 寫出正確、有效率的CSS對於網頁表現絕對有很大的幫助 CSS套用規則有以下重點： 1.CSS樣式的繼承 部分CSS指定會讓子代元素繼承相同指定，例如 font-size、font-family等 當祖先之間的指定並不相同時，會以較接近的祖先的樣式為準 實務上常見指定font CSS給body，讓整個頁面都以相同的字體大小、風格呈現 不過當某個區塊被指定了不同的font CSS，其子代元素呈現的CSS就會是該區塊的CSS指定 2.直接指定給元素的CSS樣式 直接指定的CSS套用優先度高於繼承的 其實跟上一點有關，離自己越近的規則的優先度越高，當然指定給自己的就是最優先囉 3.直接指定的樣式發生衝突時，以指定方式的加權值高者優先 CSS selectors 權值 Type selectors 1 Class selectors 10 ID selectors 100 Descendant selectors Adjacent sibling selectors Child selectors 等 1000 Pseudo element 1 Pseudo classes 10 在 CSS 基礎與選擇器使用 一文中，有提到越多層次的選擇器指定會降低效率 不過當頁面複雜度高時，有時候也只能多套用選擇器來提升指定加權值 4.當CSS樣式加權值相同時，後指定者優先套用