1. 程式人生 > >css備忘:id選擇器的權重>class選擇器的權重=屬性選擇器的權重>元素選擇器

css備忘:id選擇器的權重>class選擇器的權重=屬性選擇器的權重>元素選擇器

基本 分享 bubuko col clas AS -c 測試 com

最近的項目要自己寫前端了,重新學習下前端的一下基本知識。

一般在css樣式表中,上面的會被下面的覆蓋,如下圖,文字會顯示藍色:

技術分享圖片技術分享圖片

所以按照正常的來說,下面的css樣式,測試的文字應該還是藍色

技術分享圖片

但結果,測試文字顯示黃色,標簽選擇器的結果被屬性選擇器覆蓋了,起作用的是屬性選擇器

技術分享圖片

結論:id選擇器的權重>class選擇器的權重=屬性選擇器的權重>元素選擇器(id選擇器和class選擇器可以自行驗證),

一般相等權重的按位置覆蓋,不同權重的選擇器,位置變了也不會覆蓋

css備忘:id選擇器的權重>class選擇器的權重=屬性選擇器的權重>元素選擇器