CSS选择器的类型有：
- 基础选择器
- 组合选择器
- 属性选择器
- 伪类选择器
- 伪元素选择器
基础选择器
| 选择器 | 含义 |
|---|---|
| * | 通用选择器，匹配页面上的所有元素（很少用） |
| #id | id选择器， 匹配特定id的元素 |
| .class | 类选择器， 匹配匹配class包含(不是等于)特定类的元素 |
| element | 标签选择器 |
组合选择器
| 选择器 | 含义 |
|---|---|
| E,F | 多元素选择器，用逗号“,” 隔开，同时 |
| E F | 后代选择器，用空格分隔，匹配E元素的所有后代元素F（儿子、孙子、曾孙子，只要叫F都算） |
| E>F | 子元素选择器，匹配E元素的所有直接子元素F（儿子里叫F的都算，孙子曾孙子里叫F的不算） |
| E+F | 直接相邻选择器，匹配E元素之后的相邻的相邻的同级元素F（选择后面最近的邻居） |
| E~F | 普通相邻选择器，匹配E元素之后的同级元素F（无论相邻与否） |
| .class1.class2 | 同时具备class1和class2属性的元素 （中间不加空格，“.”和“#”本身充当了分隔符的元素） |
| element#id | 同时具备某个标签和id的元素（中间不加空格，“.”和“#”本身充当了分隔符的元素） |
属性选择器
| 选择器 | 含义 |
|---|---|
| E[attr] | 匹配所有具有attr属性的E元素 |
| E[attr = value] | 匹配attr属性值为value的元素 |
| E[attr ~= value] | 匹配所有属性attr有多个空格分隔，其中一个值等于value的元素 |
| E[attr ^= value] | 匹配属性attr的值以value开头的元素 |
| E[attr $= value] | 匹配属性attr的值以value结尾的元素 |
| E[attr *= value] | 匹配属性attr的值包含value的 |
伪类选择器
| 选择器 | 含义 |
|---|---|
| E: first-child | 匹配元素E的父元素的第一个子元素 |
| E: link | 匹配所有未被点击的链接 |
| E: visited | 匹配所有已经被访问的链接 |
| E: hover | 匹配鼠标悬停在上的E元素 |
| E: active | 匹配鼠标点击下去未被释放的E元素 |
| E: focus | 匹配当前获得焦点的E元素 |
| E: lang(c) | 匹配lang属性等于c的E元素 |
| E: enabled | 匹配表单中可用的元素 |
| E: disabled | 匹配表单中禁用的元素 |
| E: checked | 匹配表单中被选中的radio或checkbox元素 |
| E:: selection | 匹配用户当前选中的元素 |
| E:nth-child(n) | 匹配其父元素的第n个子元素，第一个编号为1 |
| E:nth-last-child(n) | 匹配其父元素的倒数第n个子元素，第一个编号为1 |
| E:nth-of-type(n) | 与:nth-child()作用类似，但是仅匹配使用同种标签的元素 |
| E:nth-last-of-type(n) | 与:nth-last-child() 作用类似，但是仅匹配使用同种标签的元素 |
伪元素选择器
| 选择器 | 含义 |
|---|---|
| E:: first-line | 匹配E元素内容的第一行 |
| E:: first-letter | 匹配E元素内容的第一个字母 |
| E:: before | 匹配E元素之前的插入内容 |
| E:: after | 匹配E元素之后的插入内容 |
