CSS(層疊樣式表)中的優先級是指當多個CSS規則應用于同一元素時,瀏覽器將根據每個規則的優先級確定哪個規則應該優先應用。下面是一個關于CSS優先級的例子:
/*樣式1*/ p { color: blue; } /*樣式2*/ #main p { color: red; } /*樣式3*/ p.special { color: green; } /*CSS選擇器的權重:ID >class >tag*/
根據上面的樣式,如果有以下HTML代碼:
<div id="main"> <p class="special">This is a special paragraph.</p> </div>
那么這個段落應用了哪個樣式呢?
首先,根據CSS選擇器的優先級規則,樣式2的ID選擇器比樣式1的標簽選擇器優先,樣式3的類選擇器優先級比樣式1的標簽選擇器也要高。因此,首先會應用樣式2和樣式3。
然而,樣式2和樣式3具有相同的權重,因為它們都由1個ID選擇器和1個類選擇器組成。因此,我們需要使用另一個規則來決定哪個樣式更具體。
在這種情況下,“p.special”比“#main p”更具體,因為它包括一個類和一個標簽。因此,這段話將應用樣式3,“color: green;”將被應用。
所以,通過這個例子,我們可以看到CSS中優先級的重要性,它允許我們控制哪些規則應該優先應用,從而確保我們的網站看起來如我們所期望。