在CSS中,偽類和屬性是兩種非常重要的概念。偽類被用來(lái)選擇某些元素在特定狀態(tài)下的樣式,比如:hover:選取鼠標(biāo)懸停在元素上時(shí)的樣式;:active:選取元素被激活(點(diǎn)擊)時(shí)的樣式;:nth-child(n):選取元素的某個(gè)特定的子元素。
在另一方面,屬性是用來(lái)設(shè)置元素的樣式的特定值,如顏色、字體等。對(duì)于如何計(jì)算CSS權(quán)重,選擇器的類型,偽類和屬性的權(quán)重在其中也是重要的因素。
/*權(quán)重為1*/ div{ font-size:16px; } /*權(quán)重為10*/ .container div{ font-size:18px; } /*權(quán)重為101*/ .container div:hover{ font-size:20px; } /*權(quán)重為100*/ .container div[title]{ font-size:18px; }
在上述示例中,當(dāng)元素存在多個(gè)樣式時(shí),其權(quán)重取決于所使用的選擇器類型,偽類和屬性。選擇器的類型對(duì)權(quán)重的貢獻(xiàn)取決于它所使用的選擇器類型。偽類和屬性的權(quán)重總是其擁有的選擇器的類型的權(quán)重+1。
所以,當(dāng)有多個(gè)樣式被應(yīng)用到元素時(shí),它們的權(quán)重將被計(jì)算,并使用具有最高權(quán)重的樣式來(lái)設(shè)置元素的樣式。
以上示例中,當(dāng)應(yīng)用多個(gè)樣式時(shí),具有:hover偽類的樣式將被最終選用,因?yàn)樗臋?quán)重為101,其余樣式的權(quán)重都小于它。
在編寫(xiě)CSS樣式表時(shí),為了避免出現(xiàn)無(wú)法預(yù)料的樣式效果,務(wù)必要考慮每種選擇器的權(quán)重,給特定元素應(yīng)用的樣式的正確順序。