CSS樣式中層級關系非常重要。在樣式表中,后面的樣式會覆蓋前面的樣式,如果兩個樣式的層級相同,則選擇器中靠后的樣式會覆蓋靠前的樣式。
#header { background-color: blue; } .sidebar li { color: green; } #content { background-color: gray; } #content p { font-size: 1.2em; } .important { font-weight: bold; color: red; }
在上面的代碼中,如果有一個段落標簽屬于id為content的元素,同時也有important類,那么它的字體將變成加粗的紅色。這是因為id選擇器的優先級高于類選擇器,而.rp順序與important類選擇器的優先級相同,但important類選擇器出現得更遲,所以最終使用了它。
在樣式表中,還有一些其他選擇器,例如標簽選擇器、偽類選擇器和偽元素選擇器等,它們的優先級低于類和id選擇器。也可以使用!important關鍵字在任何樣式聲明中提高優先級,但是這種方式不可取,應該盡量避免使用它。