一.基本選擇器
- 類選擇器 .name{}
- ID選擇器 #name{}
- 元素選擇器 name{}
- 通配符選擇器(編譯不通過) *{}
- 包含選擇器 p c{}：parent下所有的同一名字的child
- 子元素選擇器 p>c{}：parent下一層所有的同一名字的child
- 鄰近兄弟元素選擇器 c1+c2{}：同一層級中與child1相鄰的child2元素
- 通用兄弟元素選擇器 c1~c2{}：同一層級中，child1下一個（可不相鄰）child2元素
二.屬性選擇器
- E[attr]：包含attr屬性的元素
- E[attr="value"]：屬性值只等於“value"的元素
- E[attr~="value"]：有的元素屬性有很多個屬性值，該樣式表示屬性值中只要有一個是“value"的元素
- E[attr|="value"]：屬性值以“value-"開頭的元素
- E[attr^="value"]：屬性值以“value"開頭的元素
- E[attr$="value"]：屬性值以“value"結尾的元素
- E[attr*="value"]：屬性值字符串中包含“value"的元素
偽類選擇器
動態偽類選擇器（:link :visited :hover :active :focus）
- :link：鏈接沒有被訪問時的效果（微信小程序不支持）
- :hover：鼠標經過的效果（微信小程序不支持）
- :visited：鏈接被訪問后的效果（微信小程序不支持）
- :active：鼠標點下去的效果（正發生在點的那一下）
- :focus：獲得焦點后的效果
狀態偽類選擇器（:enabeld :disabled :checked）
選擇偽類選擇器（:first-child :last-child :nth-child() :nth-last-child() :nth-of-type() :nth-last-of-type() :first-of-type :last-of-type :only-child :only-of-type）
- :first-child：選擇某個元素的第一個子元素（更確切的說為：選擇第一個使用該屬性的元素）
- :last-child：選擇某個元素的最后一個子元素（更確切的說為：選擇最后一個使用該屬性的元素）
- :nth-child()：選擇某個元素的一個或多個特定的子元素（參數從1開始）
- :nth-last-child()：選擇某個元素的一個或多個特定的子元素，從這個元素的最后一個子元素開始算
- :nth-of-type()：選擇指定的元素（參數從1開始）
- :nth-last-of-type()：選擇指定的元素，從元素的最后一個開始計算
- :first-of-type：選擇一個上級元素的第一個同類子元素
- :last-of-type：選擇一個上級元素的最后一個同類子元素
- :only-child：選擇的元素是它的父元素的唯一一個子元素
- :only-of-type：選擇一個元素是它的上級元素的唯一一個相同類型的子元素
空內容偽類選擇器（:empty）：選擇的元素里面沒有任何內容
否定偽類選擇器（:not）：不匹配該屬性的每個元素（微信小程序不支持）
偽元素（::first-line ::first-letter ::before ::after ::selection）
- ::first-line：第一行
- ::first-letter：第一個字母
- ::selection：文本被選擇（如復制時）后的效果，CSS只能修改background與color兩個屬性，微信小程序不支持
原文：https://blog.csdn.net/weixin_39766005/article/details/82056839