3 回答

TA貢獻(xiàn)1785條經(jīng)驗(yàn) 獲得超8個(gè)贊
選擇器的特異性計(jì)算如下:
如果聲明來自‘Style’屬性,而不是帶有選擇器的規(guī)則,則0否則(=a)(在HTML中,元素的“樣式”屬性的值是樣式表規(guī)則)。這些規(guī)則沒有選擇器,因此a=1,b=0,c=0,d=0。 計(jì)數(shù)選擇器中的ID屬性數(shù)(=b) 計(jì)數(shù)選擇器中其他屬性和偽類的數(shù)量(=c) 計(jì)算選擇器中元素名和偽元素的數(shù)量(=d) 其特異性僅以選擇器的形式為基礎(chǔ)。特別是,表單“[id=p33]”的選擇器被計(jì)算為屬性選擇器(a=0,b=0,c=1,d=0),即使id屬性在源文檔的DTD中被定義為“ID”。
比較四個(gè)數(shù)字a-b-c-d(在一個(gè)大基數(shù)的數(shù)字系統(tǒng)中)的特性。
最后,按指定的順序排序:如果兩個(gè)聲明具有相同的權(quán)重、來源和特異性,則后者將獲勝。導(dǎo)入樣式表中的聲明被視為在樣式表本身的任何聲明之前。
.a
.b
<p class="a b">...</p>
<p class="b a">...</p>
.a
.b
.

TA貢獻(xiàn)1810條經(jīng)驗(yàn) 獲得超4個(gè)贊
<!-- start class vs id --> <p class="class1" id="id1">.class vs #id: The winner is #id</p> <!-- upper vs bottom --> <p id="id2">the very bottom is the winner</p> <!--most specific is the winner --> <p id="id3">the most specific</p> <!--pseudo and target selector --> <h3>pseudo vs type selector</h3> <!-- !important is more important! --> <h1 id="very-specific">HI! I am very important!</h1> </body>
#id1{ color: blue;}.class1{ color: red;}#id2{ color: yellow;}#id2{ color : green;}body p#id3{ color :orange;}body p{ color : purple;}body{ color : black;}h3::first-letter { color: #ff0000;}h3{ color: CornflowerBlue ; }h1{ color: gray !important;}body h1#very-specific{ color: red;}
添加回答
舉報(bào)