CSS 樣式的層疊和優先級說明

上面說了瀏覽器要查看的所有樣式來源後，現在聊一下瀏覽器顯示元素時確認一個 CSS 屬性值的次序。
補充：CSS 樣式由一條或者多條以分號分割開的樣式聲明組成。每條聲明包含著一個 CSS 屬性和該屬性的值，兩者以冒號分割。
一、CSS 樣式的層疊
CSS 的樣式可以在五個地方進行定義；不同的定義位置，其使用的順序(層疊)是不同的。
1.1、樣式如何層疊
CSS 屬性值的確認次序：
元素的內嵌樣式。
文檔內嵌樣式。
外部樣式表。
自定義瀏覽器用戶樣式。
瀏覽器內置樣式。
瀏覽器在確定某個元素的 CSS 屬性值時，先查找“元素的內嵌樣式”；
如果沒找到，則在“文檔內嵌樣式”中查找那個元素的樣式；
如果沒找到，則在“外部樣式表”文件中查找元素的樣式；
如果沒找到，則在“自定義瀏覽器用戶樣式”中查詢元素的樣式；
如果沒找到，則使用“瀏覽器內置樣式”給元素設置樣式。
1.2、important 重要樣式調整層疊次序
把樣式屬性值標記為重要(important)，可以改變正常的樣式層疊次序。
在樣式聲明後附上！important 即可將對應屬性值標記為重要。不管這種屬性定義在什麼地方，瀏覽器都會給予優先考慮。
二、同層次樣式的優先級
定義在同一層次(元素內嵌樣式、文檔內嵌樣式或者外部樣式表)的樣式，確認要使用哪個 CSS 屬性值；需要由“樣式選擇器”和樣式定義位置來確定。
2.1、CSS 選擇器的優先級
如果有兩條定義於同一層次的樣式都能應用於同一元素，而且它們都包含著瀏覽器要查找的 CSS 屬性值；這時需要通過 CSS 樣式選擇器來確定。
在同級樣式的優先級設置中，對 CSS 選擇器分類三個級別:
第一級別：ID 選擇器
第二級別：類選擇器、屬性選擇器、偽類選擇器
第三級別：標簽選擇器、偽元素選擇器
計算第一級別選擇器個數(a)，計算第二級別選擇器個數(b)，計算第三級別選擇器個數(c)。組成a-b-c 的一個三位數。
在確定元素的 CSS 樣式屬性值時，通過a-b-c 三位數比較確定。
使用 a 值較大的 CSS 屬性值為准；
如果 a 值相等，則使用 b 值較大的 CSS 屬性值為准；
如果 b 值相等，則使用 c 值較大的 CSS 屬性值為准。
2.2、優先級相同，按加載順序確定
如果定義在同一層次上的兩條樣式，應用於同一元素；並且它們的優先級 a-b-c 值也是相同的。則按照樣式的定義先後順序確定元素的 CSS 屬性值。
確定的規則為：以後面定義的樣式為准(後來者居上)。