CSS 屬性的優先級是一個非常重要的概念,因為它決定了在沖突的情況下哪個樣式將被應用于一個元素。在 CSS 中,有幾個規則來確定優先級:
/* 1. 聲明為 “!important” 的樣式具有最高優先級 */ color: red !important;
/* 2. 內聯樣式具有比 ID 選擇器更高的優先級 */這里的文本是藍色的。
/* 3. ID 選擇器具有比類選擇器和標簽選擇器更高的優先級 */ #my-id { color: green; }
/* 4. 類選擇器和標簽選擇器優先級相等,但是后者的權重略低 */ .my-class { color: yellow; } p { color: purple; }
當有多個規則應用于同一個元素時,優先級規則的權重就顯得非常重要。因為一個元素可以具有多個類、ID 和元素選擇器,所以在樣式設計時,應該考慮到這些優先級規則。
最重要的一條規則是,“!important” 標記的樣式具有最高優先級。在絕大多數情況下,應該避免使用這個屬性,因為它會給樣式表中的其他規則帶來困擾。
除此之外,內聯樣式、ID 選擇器和類選擇器都有不同程度的優先級。當有多個規則應用于同一元素時,瀏覽器將根據權重規則來決定要應用哪個樣式。為了保證樣式的一致性,我們應該確保我們對于不同的規則使用了唯一的選擇器。
下一篇css優先級評測