CSS中權重指的是樣式優先級,用于指定具有更高優先級的樣式,若發生樣式沖突時,優先使用權重高的樣式。
權重的計算方法: 1.標簽內樣式(內聯樣式):1000 2.ID選擇器:100 3.類選擇器、屬性選擇器、偽類選擇器:10 4.元素選擇器、偽元素選擇器:1 注意: 1.權重以后來居上的原則計算。 2.如果權重值相同,則以此類別后出現的樣式為準。 3.直接使用style標簽定義的樣式,優先級在內聯樣式之前,但此方法不推薦使用。
示例:
div{ color: blue; /* 權重值為1 */ } .header{ color: red; /* 權重值為10 */ } #content{ color: green; /* 權重值為100 */ } h1{ color: purple; /* 權重值為1 */ }
在上述示例中,若將`div`和`h1`標簽嵌套在`content`的`div`中并且想設置字體顏色為紅色,那么應該如何實現呢?
#content div p{ color: red; /* 權重值為101:100(ID選擇器)+1(元素選擇器)*/ }
上述方式即可實現字體顏色為紅色。