css3新增选择器
- 子级选择器
- 兄弟选择器
- 结构伪类选择器
- 伪元素选择器
- 属性选择器
子级选择器
子级选择器： 子级选择器用于选取带有特定父元素的元素
书写语法：div1>div2
注意如果div2不是div1的直接子元素，则不会被选取,只能父子级元素
代码示范：
兄弟选择器
兄弟选择器： 相邻兄弟选择器可以选中紧邻在另一个元素后面的兄弟元素，并且二者都要是同一个父级元素
书写语法：div1+div2
注意：
1、 选中的是紧跟在div1之后的同级元素div2
2、 只能选中紧跟在后面的一个div2元素
3、 +符号前后可以添加空格书写
代码示范：
其他兄弟选择器
其他兄弟选择器： 其他兄弟选择器匹配同一个父元素在div1后面所有的div2元素
书写方式：div1~div2
注意：
选择div1之后出现的所有div2
两种元素必须要相同父元素，但div2不用紧邻div1
代码示范：
结构伪类选择器
| 选择器 | 简介 |
|---|---|
| first-child | 匹配父元素中第一个对应子元素 |
| last-child | 匹配父元素中最后一个对应子元素 |
| nth-child(n) | 匹配父元素中第n个对应子元素 |
| first-of-type | 指定类型标签的第一个 |
| last-of-type | 指定类型标签的最后一个 |
| nth-of-type | 指定类型标签的第n个 |
first-child:匹配父元素中第一个对应子元素 last-child：匹配父元素中最后一个对应子元素 nth-child(n):匹配父元素中第n个对应子元素 first-of-type:指定类型标签的第一个 last-of-type:指定类型标签的最后一个 nth-of-type:指定类型标签的第n个
伪元素选择器
伪元素：
- 伪元素只能给双标签使用，不能给单标签使用
- 伪元素的冒号前面不能有空格
- 伪元素里面必须写上属性content:"";
- before和after创建一个元素，属于行内元素
| 选择器 | 介绍 |
|---|---|
| ::brfore | 在元素内部的前面插入一个元素 |
| ::after | 在元素内部的后面插入一个元素 |
| ::first-letter | 选择到元素容器的第一个字母 |
| ::first-line | 选择到元素容器的第一行文本 |
before 代码示范： after 代码示范：
属性选择器
属性选择器： 属性选择器用来选择包含指定属性的标签
| 选择器 | 简介 |
|---|---|
| E[att] | 选择具有att属性的E元素 |
| E[att="val"] | 选择具有att属性且属性值等于val的E元素 |
| E[att^="val"] | 选择具有att属性且属性值以val开头的E元素 |
| E[att$="val"] | 选择具有att属性且属性值以val结尾的E元素 |
| E[att*="val"] | 选择具有att属性且属性值包含val的E元素 |
