CSS的三大特性(繼承 層疊和優先順序)

2022-10-08 18:21:16 字數 1871 閱讀 6736

css中有些屬性是可繼承的,何為屬性的繼承?

那麼哪些樣式可以繼承哪些樣式不能繼承,具體屬性是否能繼承,可以查閱w3c官網或者mdn。

不能繼承的屬性可以使用inherit屬性值強制繼承。

注意:css屬性繼承的是計算值,並不是編寫屬性時的指定值(也就是字面值)。

css全稱 (cascading style sheets,層疊樣式表),它允許多個相同名字的css屬性層疊在同乙個元素上,層疊最後結果,只有乙個css屬性會生效。

具體哪個css屬性生效,涉及到css屬性所處環境的優先順序的高低。

為什麼有時編寫的css屬性沒有產生對應效果,很可能是因為以下原因:

(1)解決方案:可以充分利用瀏覽器的除錯工具進行除錯和查錯,也可借助css選擇器的權重值來解決。

(2)為了方便css屬性的優先順序,可以給css屬性所處的環境定義乙個權值(權重)

(3)比較優先順序的嚴謹方法:

(4)也可使用下面的**來衡量優先順序高低,使用乙個四位的字串表示,值從左到右,左面的最大,一級大於一級,數字之間沒有進製,級別之間不可超越:

選擇器權重

繼承、*

0, 0, 0, 0

元素選擇器

0, 0, 0, 1

類選擇器、偽類選擇器

0, 0, 1, 0

id選擇器

0, 1, 0, 0

內聯樣式

1, 0, 0, 0

!important

∞(無窮大)

css中有些屬性是可繼承的,何為屬性的繼承?

那麼哪些樣式可以繼承哪些樣式不能繼承,具體屬性是否能繼承,可以查閱w3c官網或者mdn。

不能繼承的屬性可以使用inherit屬性值強制繼承。

注意:css屬性繼承的是計算值,並不是編寫屬性時的指定值(也就是字面值)。

css全稱 (cascading style sheets,層疊樣式表),它允許多個相同名字的css屬性層疊在同乙個元素上,層疊最後結果,只有乙個css屬性會生效。

具體哪個css屬性生效,涉及到css屬性所處環境的優先順序的高低。

為什麼有時編寫的css屬性沒有產生對應效果,很可能是因為以下原因:

(1)解決方案:可以充分利用瀏覽器的除錯工具進行除錯和查錯,也可借助css選擇器的權重值來解決。

(2)為了方便css屬性的優先順序,可以給css屬性所處的環境定義乙個權值(權重)

(3)比較優先順序的嚴謹方法:

(4)也可使用下面的**來衡量優先順序高低,使用乙個四位的字串表示,值從左到右,左面的最大,一級大於一級,數字之間沒有進製,級別之間不可超越:

選擇器權重

繼承、*

0, 0, 0, 0

元素選擇器

0, 0, 0, 1

類選擇器、偽類選擇器

0, 0, 1, 0

id選擇器

0, 1, 0, 0

內聯樣式

1, 0, 0, 0

!important

∞(無窮大)

css三大特性 層疊 繼承 優先

1 層疊性 設定相同屬性時,後面的覆蓋前面的 2 繼承性 後代自動繼承祖先元素的樣式。3 優先順序 id 類 標籤 通配 繼承 瀏覽器預設 判斷規則 1 間接選中 繼承 就近原則 2 直接選擇,並且是同型別選擇器,後面的覆蓋前面的 3 直接選中,但是又多種型別的選擇器,利用權重計算方法 權重計算規則...

css三大特性 層疊 繼承 優先

一 三大特性 1 層疊性 設定相同屬性時,後面的覆蓋前面的 2 繼承性 後代自動繼承祖先元素的樣式。3 優先順序 id 類 標籤 通配 繼承 瀏覽器預設 二 什麼時候需要判斷優先順序 1 間接選中 繼承 繼承最近的祖先元素的該屬性,如果所有的祖先元素都沒有設定,繼承瀏覽器預設值 2 直接選擇,並且是...

CSS三大特性(繼承 優先順序 層疊)

首先宣告一下css三大特性 繼承 優先順序和層疊。繼承即子類元素繼承父類的樣式,比如font size,font weight等f開頭的css樣式以及text align,text indent等t開頭的樣式以及我們常用的color。簡單的就不演示了,強調一下font size這個東東 雖然也有繼承...