CSS入門 2 CSS的繼承性和層疊性

2021-07-24 18:00:10 字數 1082 閱讀 2300

有一些屬性,當給自己設定的時候,自己的後代都繼承上了,這個就是繼承性。

哪些屬效能繼承?

color、 text-開頭的、line-開頭的、font-開頭的。

這些關於文字樣式的,都能夠繼承;

所有關於盒子的、定位的、布局的屬性都不能繼承。

如果將body設定為:

1          body

則,body中的其他元素也會具有這些樣式

我是段落

我是段落

我是段落

層疊性:就是

css處理衝突的能力。

所有的權重計算,沒有任何相容問題!

id的數量,類的數量,標籤的數量

以id的數量為準,如id相同,依次。

如果權重一樣,那麼以後出現的為準:

#box1 .hezi2 p

div div #box3 p

div.hezi1 div.hezi2 div.hezi3 p

猜猜我是什麼顏色?

如果不能直接選中某個元素,通過繼承性影響的話,那麼權重是0。

#hezi1 #hezi2 #hezi3

div.box div.box div.box

p猜猜我是什麼顏色

如果大家都是

0,那麼有乙個就近原則:誰描述的近,聽誰的。

#hezi3

#hezi1 #hezi2

//近猜猜我是什麼顏色

同乙個標籤,攜帶了多個類名,有衝突:

spec1 spec2">我是什麼顏色?

spec2 spec1">我是什麼顏色?

1          .spec2

4         .spec1

權重問題大總結:

1) 先看有沒有選中,如果選中了,那麼以(id數,類數,標籤數)來計權重。誰大聽誰的。如果都一樣,聽後寫的為準。

2) 如果沒有選中,那麼權重是0。如果大家都是0,就近原則。

css的繼承性

一 css的繼承性 1 文字屬性 屬性 說明vertical align 垂直文字對齊 text decoration 規定新增到文字的裝飾 text shadow 文字陰影效果 white space 空白符的處理 unicode bidi 設定文字的方向 2 盒子模型的屬性 屬性 說明width...

CSS的繼承性

css的某些樣式是具有繼承性的,那麼什麼是繼承呢?繼承是一種規則,它允許樣式不僅應用於某個特定 html 標籤元素,而且應用於其後代。所有的css語句都是基於各個標籤的繼承關係的。但是並不是所有的屬性都能被繼承,一般的字型屬性都是能繼承的,不能繼承的例如邊框屬性 注意 孩子能繼承父親屬性,但是父親不...

css的繼承性

在物件導向語言都會存在繼承的概念,在物件導向語言中,繼承的特點 繼承了父類的屬性和方法。那麼我們現在主要研究css,css就是在設定屬性的。不會牽扯到方法的層面。css的繼承 就是給父級設定一些屬性,子級繼承了父級的該屬性,這就是我們的css中的繼承。官方解釋,繼承是一種規則,它允許樣式不僅應用於特...