CSS入門 3 3 CSS高階特性

2021-10-03 02:45:09 字數 1560 閱讀 9837

標籤指定式選擇器又稱交集選擇器,由連個選擇器構成,其中第乙個為標記選擇器,第二個為class選擇器或id選擇器,兩個選擇器之間不能有空格,如h3.special或p#one.

如:

這是一段藍色段落文字(普通)

"special">指定了.special類的段落文字(綠色)

後代選擇器用來選擇元素或元素組的後代,其寫法就是把外層標記寫在前面,內層標記寫在後面,中間用空格分隔。在標記發生巢狀時,內層標記就成為外層標記的後代。

例如:

段落文字巢狀在段落中,使用strong標記定義的文字(紅色)。巢狀之外由strong標記定義的文字(藍色)。

後代選擇器 p strong定義的樣式僅僅適用於巢狀在< p > 標記中的< strong >標記,其他的 < strong >標記不受影響

後代選擇器不僅限於使用兩個元素,如果需要加入更多的元素,只需要在元素之間加上空格即可。

並集選擇器是各個選擇器通過逗號連線而成的,任何形式的選擇器(包括標記選擇器,class選擇器,id選擇器等),都可以作為並集選擇器的一部分。如果某些選擇器定義的樣式完全相同,或部分相同,就可以利用並集選擇器為他們定義相同的css樣式。

例如:

"special">段落文字1,加下劃線。

段落文字2,普通文字。

"one">段落文字3,加下劃線

所謂層疊性是指多種css樣式的疊加。

例如:

"special" id="one">段落文字1

段落文字2

段落文字3

標記選擇器p和類選擇器special都定義了段落文字1的字型大小大小,但是段落文字顯示了類選擇special定義的字型大小大小,這是因為類選擇的優先順序高於標記選擇的優先順序

所謂繼承性是指書寫css樣式表時,字標記會繼承父標記的某些樣式,如文字顏色和字型大小。例如,定義主體元素body的文字顏色為黑色,那麼頁面中所有的文字都將顯示為黑色,這是因為其他的標記都巢狀在

< body >標記中,是< body >標記的字標記。

恰當的使用繼承可以簡化**,降低css樣式的複雜性。但是,如果網頁中所有的元素都大量繼承樣式,那麼判斷樣式的**就很困難,所以對於字型,文字屬性等網頁中通用的樣式可以使用繼承。例如,字型大小,字型,顏色,行距等可以在body元素中統一設定,然後通過影響文件中所有的文字。

並不是所有的css屬性都可以繼承,以下屬性不具備繼承性:

①.邊框屬性

②外邊距屬性

③內邊距屬性

④背景屬性

⑤定位屬性

⑥布局屬性

⑦元素寬高屬性

!important命令擁有最大的優先順序

id選擇器權重為100

標記選擇器權重為1

類選擇器權重為10

CSS高階特性

標籤指定式選擇器 標籤指定式選擇器又稱交集選擇器,由兩個選擇器構成,其中第乙個為標記選擇器,第二個為class選擇器或id選擇器,兩個選擇器之間不能有空格 1 3 smeta htty equlv conter.t type content tex stit1e 標籤指定式選擇器的應用 7 8 p ...

三十六 CSS高階特性

box盒子 它是抽象於現實生活中的盒子,將網頁中的所有元素看做是乙個個的盒子,那麼在調整網頁中的這些元素布局時,就可以通過調整盒子資訊來進行。盒子模型的組成 盒子內容 盒子的內邊距 盒子內容到邊框的填充 盒子邊框 盒子外邊距 1.邊框 border style solid border style ...

css入門 CSS動畫入門

css入門 在本教程中,我將向您介紹css動畫。一種高效能的做事方式,隨著瀏覽器支援的提高而越來越流行。在介紹了基礎知識之後,我們將構建乙個簡單的示例,該示例會將乙個正方形元素動畫化為乙個圓形 在envato市場的設計師們一直忙於創造了一系列的css動畫,為你插上你的 從陰影到彩帶 滑塊等。您還可以...