1、代表內聯樣式,如: style=””,權值為1000。
2、代表ID選擇器,如:#content,權值為100。
3、代表類,偽類和屬性選擇器,如.content,權值為10。
4、代表類型(元素)選擇器和偽元素選擇器,如div p,權值為1。 按照CSS代碼的執行先后順序。如果有重復的規則,按照后執行的定義。最終規則是多個定義規則的綜合。重點:高級規則定義對于不同表格的文字樣式定義。(不同表格使用不同ID、使用類樣式定義)一頁中的多種超級鏈接樣式定義。多個相同規則不同對象的CSS共同定義。對于同一對象定義的多種CSS方式考慮哪種更科學。
css選擇器優先級怎么比較
CSS選擇器中比較常見的有標簽選擇器、ID選擇器、類選擇器以及子選擇器。而事實上,CSS選擇器如果細分下來,竟然多達40多種。那他們的優先級該怎么比較呢,下面就來看看吧。
● 不同級別
1. 在屬性后面使用 !important 會覆蓋頁面內任何位置定義的元素樣式。
2. 作為style屬性寫在元素內的樣式
3. id選擇器
4. 類選擇器
5. 元素選擇器
6. 通配符選擇器
7. 瀏覽器自定義或繼承
總結排序:!important > 行內樣式 > ID選擇器 > 類選擇器 > 元素 > 通配符 > 繼承 > 瀏覽器默認屬性
● 同一級別
(1) 同一級別中后寫的會覆蓋先寫的樣式
(2) 同一級別css引入方式不同,優先級不同
總結排序:內聯(行內)樣式 > 內部樣式表 > 外部樣式表 > 導入樣式(@import)。
對于選擇器優先級,還可以通過計算權重值來比較
不包括
?一:css基本選擇器有哪些
1.css屬性選擇器
2.css標簽選擇器
3.cssID選擇器
4.css的通配符
二:css有哪些高級選擇器
1.css標簽選擇器
css標簽選擇器其實就是頁面上的所有類型的標簽,我們對經常描述稱為共性,對無法描述的稱為個性。我們在頁面上看到input,div和ul都有可能是選擇器,無論這個標簽藏得多深,都可能被選擇上,并且選擇的是所有標簽,并不是單單指一個。
2.cssID選擇器
css中我們使用#來對名字進行自定義,#是指對一個特殊的標簽來使用,并且只能用一次,在任何html標簽中,都可以有id屬性,但是前提要按照字母開頭,更不能用字母去開頭,或者和標簽同名。還有一些高手建議在css層面上盡量不要使用id。
3.css類選擇器
css中類選擇器,我們使用.來表示,我們使用類來表示,其實就是比較靈活。class和id是十分相似的,并且同一個標簽可以使用很多個類選擇器,也可以多種標簽使用。
4.css的通配符,可以替換任何標簽,目前有些瀏覽器是不支持使用。
1、元素選擇器 標簽名{ }
2、id選擇器 #id屬性值{ }
3、類選擇器 .class屬性值{ }
4、選擇器分組(并集選擇器)
作用:通過它可以同時選中多個選擇器對應的元素(通常用于集體聲明)
語法:選擇器1,選擇器2,選擇器n{ }
5、復合選擇器(交集選擇器)
作用:選擇更準確更精細的目標元素并為其設置屬性
語法:選擇器1選擇器2選擇器n{ }
!注意選擇器之間不能有空格,要緊挨在一起
6、通配選擇器
作用:用來選中頁面中所有的元素
語法:*{ }
7、后代元素選擇器
作用:選中指定元素的指定后代元素
語法:祖先元素 后代元素{ }
8、子元素選擇器
作用:選中指定父元素的子元素
語法:父元素>子元素
9、偽類選擇器
偽類表示元素的一種特殊狀態
:hover 移入時元素的狀態
:visited 已被訪問過后的元素的狀態
:active 被點擊時元素的狀態
10、 屬性選擇器
作用:根據元素中的屬性或屬性值來選取指定元素
語法:[屬性名]選取含有指定屬性的元素
? [屬性名=“屬性值”]選取含指定屬性值的元素
? [屬性名^="屬性值"] 選取屬性值以指定內容開頭的元素
? [屬性名$="屬性值"] 選取屬性值以指定內容結尾的元素
? [屬性名*="屬性值"] 選取屬性值包含指定內容的元素
11、兄弟元素選擇器
+選擇器
作用:選中一個元素后緊挨著的指定的兄弟元素
語法:前一個+后一個(作用在后一個)
~選擇器
作用:選中后邊所有的制定兄弟元素
語法:前一個~后邊所有