css的優先順序應該是作為css基本知識而廣為知道的,所以css入門後，就一直把css的優先順序記掛在心裡（自覺告訴自己這地方很可能會摔跤）。起初可能是因為自己的專案經驗不夠豐富，或者是自己所接觸到的專案都是小規模的前端，也或與自己書寫css的習慣有關（自己基本上就是逐層書寫css，盡量把**寫得乾淨整潔），css優先順序並沒有成為某次專案的絆腳石。直到某次專案，因為用到的css庫與自己頁面的設計稿有衝突，才再次重視起css的優先順序。
以下就將有關css的優先順序的知識進行歸納整理：
①繼承的不如指定的；②id>class>標籤選擇符；③越具體的樣式越強大；④標籤 id>id;標籤 class>class。
css優先順序權重的計算方法：css優先順序包含四個級別（標籤內選擇符，id選擇符，class選擇符，元素選擇符）以及各級別出現的次數。根據這四個級別出現的次數計算得到css的優 先級，規則如下：
①元素標籤中定義的樣式，加1000；
②每個id選擇符，加0100；
③每個class選擇符、每個屬性選擇符、每個偽類，加0010；
④每個元素選擇符或偽元素選擇符，加0001；
將這四個數字分別累加，就得到每個css定義的優先順序的值，然後從左到右逐位比較大小，數字大的css樣式的優先順序高。
舉例：假設對應example.html在example.css檔案中定義如下樣式：
1. h1 /*乙個元素選擇符，結果為0001*/
2. body h1 /*兩個元素選擇符，結果是0002*/
3. h2.grape /*乙個元素選擇符、乙個class選擇符，結果是0011*/
4. li#answer /*乙個元素選擇符，乙個id選擇符，結果是0101*/
而同時在example.html中有：
/*元素標籤中定義，乙個元素選擇符，結果是1001*/
1001是有關h1樣式中計算最大的，所以h1元素的顏色應該是藍色的。
有關css優先順序的計算就介紹到此。
接下來介紹！important：
!important宣告的樣式優先順序最高。
如何想更透徹掌握!important，如下部落格鏈結可能會對你有所幫助：
CSS權重以及優先順序
權重的級別劃分包含了所有的css選擇器 如果兩個選擇器作用在同乙個元素上，則權重高者生效 權重的級別根據選擇器被分為四個分類 行內樣式，id，類和屬性，以及元素。當很多規則都被應用到某乙個元素上時，全中決定了那種規則生效。每個選擇器都有自己的權重。每個css規則，都包含了乙個權重級別。如果兩個選擇器...
前端css優先順序以及繼承
css具有兩大特性 繼承性和層疊性 繼承性繼承 給父級設定一些屬性，子級繼承了父級的該屬性，這就是我們的css中的繼承。有一些屬性是可以繼承下來 color font text line 主要是文本級的標籤元素。但是像一些盒子元素屬性，定位的元素 浮動，絕對定位，固定定位 不能繼承。層疊性層疊性 權...
css 優先順序
當我們的css樣式中，如果同個元素有兩個或以上衝突的css規則，瀏覽器有一些基本的規則來決定哪乙個非常特殊而勝出，也就是常講的css優先順序。一般情況下，你不必擔心css樣式衝突，但對於大型而且複雜的css樣式檔案，或有很多css檔案組成的，就非常有可能產生衝突。下面我們通過2個簡單的例項來了解一下...