CSS3选择器
属性选择器
E[att^=value] 属性选择器
是指选择名称为E的标记，且该标记定义了att属性，att属性值包含前缀为value的子字符串。 E元素可以省略，如果省略则表示可以匹配满足条件的任意元素。
如： div[id^=section]
表示匹配包含id属性，且id属性值是以“section”字符串开头的div元素。
E[att$=value]属性选择器
是指选择名称为E的标记，且该标记定义了att属性，att属性值包含后缀为value的子字符串。与E[att^=value]选择器一样，E元素可以省略，如果省略则表示可以匹配满足条件的任意元素。
如： div[id$=section]
表示匹配包含id属性，且id属性值是以“section”字符串结尾的div元素。
E[att*=value]属性选择器
用于选择名称为E的标记，且该标记定义了att属性，att属性值包含value子字符串。该选择器与前两个选择器一样，E元素也可以省略，如果省略则表示可以匹配满足条件的任意元素。
如： div[id*=section]
表示匹配包含id属性，且id属性值包含“section”字符串的div元素。
关系选择器
子代选择器（>）：主要用来选择某个元素的第一级子元素。
如： 希望选择只作为 h1 元素子元素的 strong 元素，可以这样写：h1 > strong。
兄弟选择器（+、~）
用来选择与某元素位于同一个父元素之中，且位于该元素之后的兄弟元素。
临近兄弟选择器：
该选择器使用加号“+”来链接前后两个选择器。选择器中的两个元素有同一个父亲，而且第2个元素必须紧跟第1个元素。
普通兄弟选择器：
使用 “~”来链接前后两个选择器。选择器中的两个元素有同一个父亲，但第2个元素不必紧跟第1个元素。
结构化伪类选择器
root选择器
用于匹配文档根元素，在HTML中，根元素始终是html元素。也就是说使用“:root选择器”定义的样式，对所有页面元素都生效。对于不需要该样式的元素，可以单独设置样式进行覆盖。
not选择器
如果对某个结构元素使用样式，但是想排除这个结构元素下面的子结构元素，让它不使用这个样式，可以使用:not选择器。
only-child 选择器
用于匹配属于某父元素的唯一子元素的元素，也就是说，如果某个父元素仅有一个子元素，则使用“:only-child 选择器”可以选择这个子元素。
first-child和:last-child选择器
分别用于为父元素中的第一个或者最后一个子元素设置样式。
nth-child(n)和:nth-last-child(n)选择器
分别用于为父元素中的第二个或者倒数第二个子元素设置样式。
nth-of-type(n)和:nth-last-of-type(n)选择器
用于匹配属于父元素的特定类型的第 n 个子元素和倒数第n个子元素。
empty选择器
用来选择没有子元素或文本内容为空的所有元素。
target选择器
用于为页面中的某个target元素（该元素的id被当做页面中的超链接来使用）指定样式。只有用户单击了页面中的超链接，并且跳转到target元素后，:target选择器所设置的样式才会起作用。
伪元素选择器
before伪元素选择器
用于在被选元素的内容前面插入内容，必须配合content属性来指定要插入的具体内容。
如：
<元素>:before
{
content:文字/url();
}
after伪元素选择器
用于在某个元素之后插入一些内容，使用方法与:before选择器相同。
链接伪类
链接伪类
定义超链接时，为了提高用户体验，经常需要为超链接指定不同的状态，使得超链接在点击前、点击后和鼠标悬停时的样式不同。在CSS中通过链接伪类可以实现不同的链接状态
超链接标记<a>的伪类（每个样式只能对应应用一次）
超链接标记<a>的伪类 |
含义 |
|---|---|
| a:link{ CSS样式规则; } | 未访问时超链接的状态 |
| a:visited{ CSS样式规则; } | 访问后超链接的状态 |
| a:hover{ CSS样式规则; } | 鼠标经过、悬停时超链接的状态 |
| a:active{ CSS样式规则; } | 鼠标点击不动时超链接的状态 |
补充知识点：
优先级：
内联样式>内部样式>外部样式
内联样式：由css样式选择符和声明组成，而声明又由属性和值组成
选择符：{属性：值} 例：p{color：red}
选择符：又称选择器，指明网页中要应用样式规则的元素
内部样式：代码通常放在标签内
外部样式引入：link @import
群组选择器：如h1，h2{} 中间用逗号连接
考点：
- link和@import的区别（无样式闪烁问题FOUC）
@import是CSS提供的语法规则，只有导入样式表的作用；link是HTML提供的标签，不仅可以加载CSS文件，还可以定义RSS，rel连接属性等。
加载页面时，link标签引入的CSS被同时加载；@import引入的CSS将在页面加载完毕后被加载。
@import是CSS2.1才有的语法，故只可在IE5+才能识别；link标签作为HTML元素，不存在兼容性问题。 - 三种引入样式的优先级
- 选择符的优先级
| 通配符 | 0 |
|---|---|
| 标签 | 1 |
| 类/伪类/属性 | 10 |
| ID | 100 |
| 行内样式 | 1000 |
| important | 1/0（无穷大） |