1. 程式人生 > 實用技巧 >CSS筆記

CSS筆記

CSS權重問題

型別 權重
! important Inf
行內樣式 1000
id 100
class/偽類/屬性選擇器 10
標籤選擇器/偽元素 1
萬用字元,>,+,~ 0

注意

  1. 其中的權重並不是10進位制,而是256進位制,11個class並不能超過1個id
  2. Inf+1Inf的權重要大

一些例子

01. *{}                         ====》0
02. li{}                        ====》1(一個元素)
03. li:first-line{}             ====》2(一個元素,一個偽元素)
04. ul li {}                    ====》2(兩個元素)
05. ul ol+li{}                  ====》3(三個元素)
06. h1+ *[rel=up] {}            ====》11(一個屬性選擇器,一個元素)
07. ul ol li.red{}              ====》13(一個類,三個元素)
08. li.red.level{}              ====》21(兩個類,一個元素)
09. style=""                    ====》1000(一個行內樣式)
10. p {}                        ====》1(一個元素)
11. div p {}                    ====》2(兩個元素)
12. .sith {}                    ====》10(一個類)
13. div p.sith{}                ====》12(一個類,兩個元素)
14. #sith{}                     ====》100(一個ID選擇器)
15. body #darkside .sith p {}   ====》112(1+100+10+1,一個Id選擇器,一個類,兩個元素)</pre>