CSS樣式繼承和層疊

這篇文章主要介紹了CSS樣式繼承和層疊的相關資料,需要的朋友可以參考下

一:基本選取器

標籤選擇：根據頁面當中標籤名字進行選擇，直接把樣式應用到指定的標籤上。

特點：

1.標籤選取器會對當年頁面當中所有的指定標籤進行選擇；

2.標籤選取器對代碼的當前標籤階層沒有任何關聯，只要是在當前頁面上，都能被選中。

id選擇：需要先指定一個標籤設定id值（id值不能重複是整個頁面中唯一的）。

class選擇：通過給標籤取類名，通過類別選取器選擇指定標籤。

二：三套複雜選取器

1.後代選取器

A、可以根據當前選擇中的標籤，找到後續子標籤

B、後代選取器可以進行多層精確選擇

2.交集選取器

格式：第一層選擇第二層選擇{}

注意：點表示交集，一般以標籤開頭

3.並集選取器

格式：第一個選取器，第二個選取器，…{}

三：css繼承性

定義：有一些樣式，在給當前標籤設定的時候，同時會給它後代標籤進行設定
注意：繼承到樣式的標籤和定義樣式的標籤必須是從屬關係（後代標籤關係）
對文本樣式設定的基本屬性才能被繼承（顏色color\樣式text\字型font\行屬性line）
所有關於對於盒子模型（p、span等）的屬性設定（border、定位、布局）都不能被繼承

四：css層疊性

定義：多個選取器同時作用在同一個標籤上的時候，會根據優先順序別來進行樣式作用

選取器的判定方式：

-通過權值判斷法
-通過每一個選擇其中的id選擇、類選擇、標籤選擇數量來計做權值（ICE）
-先比較id權值，再次比較類、最後比較標籤
-全部一樣比較順序

注意：如果權值一樣，則後面覆蓋前面。數權值的前提是一定保證每一條選取器必須要選中指定元素。

如果範圍沒有直接作用到標籤本身上，則體現的就是就近原則

important優先順序最高，*優先順序最低