来源：
结构伪类选择器主要根据文档结构来选择元素，常用于根据父级选择器的子元素
| 选择符 | 简介 |
|---|---|
| E:first-child | 匹配父元素中的第一个子元素E |
| E:last-child | 匹配父元素中最后一个E元素 |
| E:nth-child(n) | 匹配父元素中的第n个子元素E |
| E:nth-last-child(n) | 匹配父元素的倒数第n个子元素E |
| E:first-of-type | 指定类型E的第一个 |
| E:last-of-type | 指定类型E的最后一个 |
| E:nth-of-type(n) | 指定类型E的第n个 |
| E:nth-last-of-type(n) | 指定类型E的倒数第n个 |
区别：
- nth-child对父元素里面的所有孩子排序选择（序号是固定的）先找到第n个孩子，然后看看是否和匹配
- nth-of-type对父元素里面指定子元素排序选择，先去匹配E，然后再根据E找到第n个孩子
- n可以是数字，关键字和公式
- n如果是数字，就是选择第n个子元素，里面数字从1开始...
- n可以是关键字：even偶数，odd奇数
- n可以是公式：常见的公式如下（如果n是公式，则从0开始计算，但是第0个元素或者超出了元素的个数会被忽略）
- 要使该属性生效，E元素必须是某个元素的子元素，E的父元素最高是body，即E可以是body的子元素
- E:nth-child(n)会选择父元素的第n个子元素E，如果第n个子元素不是E，则是无效选择符，但n会递增。
| 公式 | 取值 |
|---|---|
| 2n | 偶数 |
| 2n+1 | 奇数 |
| 5n | 5 10 15 20 25... |
| n+5 | 从第5个开始（包含第五个）到最后 |
| -n+5 | 前5个（包含第5个）... |
小结：
- 结构伪类选择器一半用于选择父级里面的第几个孩子
- nth-child对父元素里面所有孩子排序（序号是固定的）先找到第几个孩子，然后看看是否匹配。如section div:nth-child(1)，执行的时候先看section下的第1个孩子，再看第一个孩子是否是div
- nth-of-type对父元素里面指定子元素进行排序选择，先去匹配E，然后再根据E找到第n个孩子。如
section div:nth-of-type(1){}执行的时候首先看section下的指定的元素div，之后回去看section第1个div孩子 - 关于nth-child(n)我们要知道n是从0开始计算的，要记住常用公式
- 如果是无序列表，我们肯定用nth-child更多
- 类选择器、属性选择器、伪类选择器、权重为10
