css的繼承 層疊 特殊和重要性

2021-07-23 05:56:59 字數 795 閱讀 8009

應用場景:比如< p >< /p >中包含< span >< /span >

應用在< p >之中的**,也會影響到< span >中樣式

但也不是所有語句都會,比如:一些邊框的樣式**

許多**作用於一種標籤,從網頁顯示也只能是一種,權值最高的,就使用哪一種

/*

標籤權值為1;

類選擇器權值為10;

id選擇符權值為100*/p

/*權值為1*/

pspan

/*權值為1+1=2*/

.warning

/*權值為10*/

#footer

.note

p /*權值為100+10+1=111*/

/*繼承也有權值,但是非常低,可以理解為最低*/

若是相同權值,那我們應該怎麼辦呢?層疊就是解決這個的

當相同權值時,會根據css樣式**前後順序決定,處於後面的會被應用

(可以理解為後面覆蓋了前面的)

優先順序:

內聯樣式表(標籤內部)>嵌入樣式表(當前檔案中)>外部樣式表(外部檔案中)

使用格式:p

網頁優先順序:

瀏覽器預設格式《網頁製作者樣式《使用者自己設定的樣式(比如:網頁大小,字型,字型大小)

但是,!important是乙個例外,它的權值大於使用者設定樣式!

CSS的繼承 層疊 特殊性和重要性

學習目標 認識 css 的一些特性 繼承 層疊 特殊性和重要性 繼承是一種規則,它允許樣式不僅應用於某個特定 html 標籤元素,而且應用於某後代。如下所示 p 三年級時,我還是乙個膽小如鼠span 的小女孩。p 上面 的效果是 p 中的文字與 span 中的文字都設定了紅色。但需要注意的是,有些 ...

CSS的繼承 層疊 特殊性和重要性

繼承 繼承 是一種規則,它允許樣式不僅應用於某個特定html標籤元素,而且應用於其後代。比如下面 如某種顏色應用於p標籤,這個顏色設定不僅應用p標籤,還應用於p標籤中的所有子元素文字,這裡子元素為span標籤。可見右側結果視窗中p中的文字與span中的文字都設定為了紅色。但注意有一些css樣式是不具...

CSS的繼承 特殊性 層疊 重要性

css的某些樣式是具有繼承性的,那麼什麼是繼承呢?繼承是一種規則,它允許樣式不僅應用於某個特定html標籤元素,而且應用於其後代。比如下面 如某種顏色應用於p標籤,這個顏色設定不僅應用p標籤,還應用於p標籤中的所有子元素文字,這裡子元素為span標籤。p 我是乙個喜歡程式設計的小女孩。可見結果視窗中...