1 :target

• 表示元素被hash匹配時的狀態
• eg:URL是/post/a#p1時，id為p1的元素處於被target的狀態
  
  p{diesplay:none; }
  p :target{display:block;}

2 :lang

• 元素匹配上指定語言時的狀態
• 瀏覽器通過lang屬性獲得語言資訊
• eg:不同文字的符號有可能不一樣，所以用lang去檢測文字並匹配
  
  :lang(fr) p:before{content:”<”;}
  :lang(fr) p:after{content:”>”;}

3 :nth-child

• nth-child(an+b)選中某些子元素
• eg: nth-child(3n),選中3，6，9…..等元素

4 :first-child
:last-child
:first-line:首行
:first-letter ：首字母
:nth-last-child(n): 匹配屬於其元素的第 n個子元素的每個元素，不論元素的型別，從最後一個子元素開始計數
:nth-last-of-type(n)：匹配屬於父元素的特定型別的第 n 個子元素的每個元素，從最後一個子元素開始計數
:first-of-type:匹配屬於其父元素的特定型別的首個子元素的每個元素
:last-of-type

5 :not()

• 排除匹配的元素
• eg: img:not([alt])，選擇沒有寫alt屬性的圖片
  

6 :empty

• 匹配標籤裡沒有任何子元素
• eg: li:empty{display:none;}

7 :checked

• checkbox被選中時的狀態

• eg:當checkbox的狀態改變時，lable也會做相應的動作

  
  .toggle input[type=checkbox]{visibility:hidden;}
  .toggle input:checked + label{left:43px;}