僞類選擇器

僞類選擇器 ： 權重都是10

僞類選擇器又可以分為：

動态僞類 5個

UI狀态僞類 3個

結構僞類 12個

目标僞類 1個

否定僞類 1個

語言僞類 1個

屬性選擇器 7個

動态僞類 5種

1、a:link{} 連結初始的樣式，指的是a标簽

2、a:visited{} 連結通路過後的樣式 指的是a标簽

3、:hover{} 滑鼠懸停 可以是任何标簽 (重點)

4、a:active{} 連結按住不動的時候的樣式

5、input:focus{} 選擇獲得焦點的輸入字段之後的樣式

前4個如果都是同時給a的話，順序不要亂，并且現在需要手動清除浏覽器的緩存

UI狀态僞類 3種 更适合表單相關去使用

1、 ：disabled{} 禁用的時候

2、 :checked{} 選中的時候

3、 ：enabled{} 可用狀态下的時候

結構僞類選擇器 12種 IE8及以下不相容

-child結尾的 5種

必須是第一個子元素，并且必須是指定類型的

：first-child{}
           

必須是最後一個子元素，并且必須是指定類型的

：last-child{}
           

從頭開始指定子元素的第幾個（）裡填需要的第幾個，可以填純數字或者數學表達式n

：nth-child(2){}  表示第二個
     ：nth-child(2n ){} 表示第2n個
           

從結尾開始指定子元素的第幾個（）裡填需要的第幾個，可以填純數字或者數學表達式n

：nth-last-child(2){}表示倒數第二個
     ：nth-last-child(2n){}表示從倒數開始第2n個
           

必須是隻有一個指定的子元素，不可以出現其他類型元素

:only-child{}
           

-type結尾的 5種

子元素中指定元素的第一個，指定元素不需要規定是第一個子元素

：first-of-type{}
           

子元素中指定元素的最後一個，指定元素不需要規定是最後一個子元素

：last-of-type{}
           

指定子元素中的第幾個（）裡填需要的第幾個，可以填純數字或者數學表達式n，指定元素不需要規定是第一個子元素

：nth-of-type(){}
           

指定子元素中的倒數第幾個（）裡填需要的第幾個，可以填純數字或者數學表達式n，指定元素不需要規定是最後一個子元素

：nth-last-of-type(){}
           

必須是隻有一個指定的子元素，可以出現其他類型元素排列順序可随意

:only-of-type{}
           

：empty

當元素為空的時候變化

：root

根元素變化

結論：

-type結尾的比-child結尾的要求低一點，-child結尾較為嚴格

目标僞類 ：target{}

在靜态頁面裡面 目标僞類必須和錨點一起用

錨點必須是a标簽和id一起用   
           

否定僞類 ：not(否定的條件){}

/* 除了偶數的li，其他的li變化 */
   ul li:not(:nth-of-type(2n)){ border: 2px solid red;}
           

語言僞類 :lang(){}

就是給不同的語言添加不同的符号去标注

：lang()裡面必須是語言的簡寫
           

動态僞類5+UI狀态僞類3+結構僞類12+否定僞類1+目标僞類1+語言僞類1

所有的僞類權重是10