首頁  >  文章  >  web前端  >  CSS樣式就近原則是什麼

CSS樣式就近原則是什麼

WBOY
WBOY原創
2022-04-27 17:56:383539瀏覽

在css中,樣式的就近原則指的是當多種不同的樣式規則應用在同一元素上時,若樣式權重相同,則靠近元素的樣式具有最大的優先級;就近原則也可以理解為多種樣式權重相同時,排在最後的樣式優先權最大。

CSS樣式就近原則是什麼

本教學操作環境:windows10系統、CSS3&&HTML5版本、Dell G3電腦。

CSS樣式就近原則是什麼

CSS優先權

在複雜CSS樣式表,往往不是相同樣式不同值的堆疊這麼簡單,常出現兩個或多個不同樣式規則應用在同一元素上,這時到底採用哪個樣式呢?這就是典型的CSS優先權問題。

處理優先權問題,就是考慮樣式權重的高低。這裡先跟大家介紹一些特殊的情況:

==繼承樣式的權重為0。 ==也就是說,在巢狀結構中,無論父元素樣式權重多大,子元素繼承時,套用在子元素上的權重都為0,即子元素定義的樣式會覆寫所有繼承來的樣式。

==行內樣式優先。 ==應用style屬性的元素,其行內樣式的權重非常高,可以理解為遠大於100。總之,他擁有比上面提升的選擇器都大的優先權。

權重相同時,CSS遵循就近原則。也就是說靠近元素的樣式具有最大的優先級,或者說排在最後的樣式優先級最大。

CSS定義了一個!important指令,該指令被賦予最大的優先權。也就是說不管權重如何以及樣式位置的遠近,!important都具有最大優先權。

css權重

關於CSS權重,我們需要一套計算公式來去計算,這就是CSS Specificity,我們稱為CSS 特性或稱非凡性,它是一個衡量CSS值優先權的一個標準具體規範入如下:

Specificity用一個四位的數字字串(CSS2是三位)來表示,更像四個級別,值從左到右,左面的最大,一級大於一級,數位之間沒有進制,級別之間不可超越。

CSS樣式就近原則是什麼

(學習影片分享:css影片教學

以上是CSS樣式就近原則是什麼的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn