CSS三大特性

2021-09-26 11:23:45 字數 1824 閱讀 5356

p會變成紅色!!!

注意點:

並不是所有的屬性都可以繼承, 只有以color/font-/text-/line-開頭的屬性才可以繼承

。在css的繼承中不僅僅是兒子可以繼承, 只要是後代都可以繼承。

繼承性中的特殊性

:a標籤的文字顏色和下劃線是不能繼承的

。h標籤的文字大小是不能繼承的。

應用場景:

一般用於設定網頁上的一些共性資訊, 例如網頁的文字顏色, 字型,文字大小等內容

作用: 層疊性就是css處理衝突的一種能力

我是段落

最終顯示為藍色,紅色被覆蓋!!

注意點:

層疊性只有在多個選擇器選中"同乙個標籤", 然後又設定了"相同的屬性", 才會發生層疊性

。作用:當多個選擇器選中同乙個標籤, 並且給同乙個標籤設定相同的屬性時, 如何層疊就由優先順序來確定

優先順序判斷的三種方式:

間接選中

:指繼承

,如果是間接選中, 那麼就是誰離目標標籤比較近就聽誰的

相同選擇器(直接選中)

:如果都是直接選中, 並且都是同型別的選擇器, 那麼就是誰寫在後面就聽誰的

不同選擇器(直接選中)

:如果都是直接選中, 並且不是相同型別的選擇器, 那麼就會按照選擇器的優先順序來層疊

;id>類》標籤》萬用字元》繼承》瀏覽器預設

間接選中    最終顯示藍色

相同選擇器(直接選中)最終顯示紅色

不同選擇器(直接選中)  最終顯示紫色

作用: 當多個選擇器混合在一起使用時, 我們可以通過計算權重來判斷誰的優先順序最高

注意點:

只有選擇器是直接選中標籤的才需要計算權重, 否則一定會聽直接選中的選擇器的

權重的計算規則:

首先先計算選擇器中有多少個id, id多的選擇器優先順序最高

如果id的個數一樣, 那麼再看類名的個數, 類名個數多的優先順序最高

如果類名的個數一樣, 那麼再看標籤名稱的個數, 標籤名稱個數多的優先順序最高

如果id個數一樣, 類名個數也一樣, 標籤名稱個數也一樣, 那麼就不會繼續往下計算了, 那麼此時誰寫在後面聽誰的

id多,最終顯示紅色

id一樣,比類多,最終顯示藍色

id一樣,類一樣,比標籤多最終顯示紅色

id一樣,類一樣,標籤一樣,最終顯示紅色。

作用: 用於提公升某個直接選中標籤的選擇器中的某個屬性的優先順序的, 可以將被指定的屬性的優先順序提公升為最高。

注意點:

!important只能用於直接選中, 不能用於間接選中

;萬用字元選擇器選中的標籤也是直接選中的

;!important只能提公升被指定的屬性的優先順序, 其它的屬性的優先順序不會被提公升

;!important必須寫在屬性值得分號前面

;!important前面的感嘆號不能省略。

最終顯示綠色!!!

CSS三大特性

css三大特性 1.繼承性 作用 子元素可以繼承父元素的樣式 text font line 這些元素開頭的都可以繼承,以及color屬性 特殊性 1 a標籤的字型顏色不能繼承,必須對a標籤自定義字型顏色才能修改 2 h1 h6標籤的字型大小不能繼承,必須對標籤自身修改字型大小才有效。我是div1中的...

CSS三大特性

樣式具有繼承性,一般有關text line font 都能夠繼承。a標籤的顏色不能繼承 繼承title type text css div1 字型和顏色被繼承偽類但是邊框沒有 style head id div1 這是div1中的內容 id div22 這是div2中的內容 div div body...

CSS三大特性

1.繼承 子代可以直接使用父代的某些樣式 特徵 當然有些可以繼承,有些不能繼承。例 介是div1的內容 介是div1的後代div2中的內容 結果為 div2同樣繼承了div1的樣式。div2雖然沒有設定這樣的樣式,但是實際上卻使用了該樣式。說明它的樣式從它的父代div1那裡繼承而來。但是並不是所有的...