CSS選擇器

CSS三大特性—— 繼承、 優先級和層疊。

繼承：即子類元素繼承父類的樣式;

優先級：是指不一樣類別樣式的權重比較;

層疊：是說當數量相同時，經過層疊(後者覆蓋前者)的樣式。

css選擇符分類　　

首先來看一下css選擇符(css選擇器)有哪些?

　　1.標籤選擇器(如：body,div,p,ul,li)

　　2.類選擇器(如：class="head",class="head_logo")

　　3.ID選擇器(如：id="name",id="name_txt")

　　4.全局選擇器(如：*號)

　　5.組合選擇器(如：.head .head_logo,注意兩選擇器用空格鍵分開)

　　6.後代選擇器 (如：#head .nav ul li 從父集到子孫集的選擇器)

　　7.羣組選擇器 div,span,img {color:Red} 即具備相一樣式的標籤分組顯示

　　8.繼承選擇器(如：div p,注意兩選擇器用空格鍵分開)

　　9.僞類選擇器(如：就是連接樣式,a元素的僞類，4種不一樣的狀態：link、visited、active、hover。)

　　10.字符串匹配的屬性選擇符(^ $ *三種，分別對應開始、結尾、包含)

　　11.子選擇器 (如：div>p ,帶大於號>)

　　12.CSS 相鄰兄弟選擇器器 (如：h1+p,帶加號+)

css優先級

當兩個規則都做用到了同一個html元素上時，若是定義的屬性有衝突，那麼應該用誰的值的，CSS有一套優先級的定義。

不一樣級別

1. 在屬性後面使用 !important 會覆蓋頁面內任何位置定義的元素樣式。
2. 做爲style屬性寫在元素內的樣式
3. id選擇器
4. 類選擇器
5. 標籤選擇器
6. 通配符選擇器
7. 瀏覽器自定義或繼承

      總結排序：!important > 行內樣式>ID選擇器 > 類選擇器 > 標籤 > 通配符 > 繼承 > 瀏覽器默認屬性

權重

!important　 　　　　infinity

行間樣式　　 　　　 1000

id　　　　　　　   　100

class |屬性|僞類　　  10

標籤|僞元素　　　　 1

通配符　　　　　　  0

 

權重是256進制