css樣式的優先級排序


選擇器優先級:
通常我們可以將CSS的優先級由高到低分為六組:

  1、無條件優先的屬性只需要在屬性后面使用 !important 。它會覆蓋頁面內任何位置定義的元素樣式。IE 6不支持這個屬性;
  2、第二高位的優先屬性是在html中給元素標簽加style。由於該方法會造成CSS的難以管理,所以不推薦使用。
  3、第三級優先的屬性是由一個或多個id選擇器來定義的。例如 #id{margin:0;} 會覆蓋 .classname{margin:3px;}。
  4、第四級的屬性由一個或多個 類選擇器、屬性選擇器、偽類選擇器定義。如 .classname{margin:3px;} 會覆蓋 div{margin:6px;}
  5、第五級由一個或多個 類型選擇器定義。如 div{margin:6px;} 覆蓋 *{margin:10px;} 。
  最低一級的選擇器是為一個通配選擇器,用*{margin:10px;}這樣的類型來定義。

  另外,可以用一句極為簡單的話來描述CSS優先級問題:當一個CSS選擇器擁有更多的高級別屬性時,它的優先級就會比較高。如 #i100
  *.c20 *.c10{} 的優先級就會高於 #i100 *.c10 div p span em{}
  ,這是由於前者擁有一個第三級和兩個第四級的選擇器而后者第三級和第四級的選擇器各為一個,當然前者優先級會比較高。
相同級別的優先級:
當比較多個相同級別的CSS選擇器優先級時,它們定義的位置將決定一切。下面從位置上將CSS優先級由高到低分為六級:

  1、位於<head/>標簽里的<style/>中所定義的CSS擁有最高級的優先權。
  2、第二級的優先屬性由位於 <style/>標簽中的 @import 引入樣式表所定義。
  3、第三級的優先屬性由<link/>標簽所引入的樣式表定義。
  4、第四級的優先屬性由<link/>標簽所引入的樣式表內的 @import 導入樣式表定義。
  5、第五級優先的樣式由用戶設定。
  最低級的優先權由瀏覽器默認。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM