核心提示：基本选择器 选择器 语法 类型选择器2 elename 类选择器 .classname ID选择器 #idname 通用选择器 * 属性选择器 [attr] 选择存在at...
基本选择器
| 选择器 | 语法 |
|---|---|
| 类型选择器2 | elename |
| 类选择器 | .classname |
| ID选择器 | #idname |
| 通用选择器 | * |
| 属性选择器 | [attr] 选择存在attr属性的元素 [attr=value]选择attr属性为value的元素 [attr~=value]选择 attr 属性的值（以空格间隔出多个值）中有包含 val 值的所有元素 [attr*=value]选择attr属性的值中包含字符串val的元素 [attr^=value]选择attr属性的值以val开头（包括val）的元素 [attr$=value]选择attr属性的值以val结尾（包括val）的元素 [attr|=value]选择attr属性的值以val或val-开头的元素 |
关系选择器
| 选择器 | 语法 | 解释 |
|---|---|---|
| 相邻兄弟选择器 | A+B | 匹配紧跟其A元素的兄弟元素B |
| 一般兄弟选择器 | A~B | 匹配A元素后的兄弟元素中的B元素 |
| 子选择器 | A>B | 匹配A元素的子元素中的B元素 |
| 后代选择器 | A B | 匹配A元素的后代元素中的B元素 |
伪类选择器
伪类以一个冒号为前缀，表示了在某种状态下的指定元素。
| 选择器 | 解释 |
|---|---|
| :focus | 当元素获得焦点时选中 |
| :link | 应用于URL尚未访问的链接 |
| :hover | 应用于处于“悬停状态”的元素 |
| :active | 应用于处于激活状态的元素 |
| :visited | 应用于URL访问过的链接 |
| :first-child | 元素作为第一个子元素时被选中 |
| :first-of-type | 元素作为同类型的第一个子元素时被选中 |
| :last-child | 元素作为最后一个子元素时被选中 |
| :last-of-type | 元素作为同类型的最后一个子元素时被选中 |
| :not(X) | 匹配不符合参数选择器X描述的元素,X为简单的选择器 |
| :nth-child(an+b) | 匹配在兄弟节点中的位置与模式 an+b 匹配的元素 |
| :nth-of-type(an+b) | 匹配那些在它之前有 an+b-1 个相同类型兄弟节点的元素 |
| :nth-last-child(an+b) | 和 :nth-child 一样，只是它从结尾处反序计数，而不是从开头处 |
| :nth-last-of-type(an+b) | 和 :nth-of-type 一样，只是它从结尾处反序计数，而不是从开头处 |
| :only-child | 作为父元素的唯一一个子元素被选中 |
| :only-of-type | 没有同类型的兄弟元素时被选中 |
伪元素选择器
伪元素以两个冒号为前缀，代表的是指定元素的某个部分。实际上在DOM树中并不存在。
| 选择器 | 解释 |
|---|---|
| ::after | 创建一个伪元素，做为已选中元素的最后一个子元素 |
| ::before | 创建一个伪元素，做为已选中元素的第一个子元素 |
| ::first-line | 块级元素的第一行 |
| ::first-letter | 某块级元素第一行的第一个字母(文字所处的行之前没有其他内容) |
| ::section | 文档中被选中的部分 |
