选择符 简介
E: first-child 匹配父元素中第一个子元素E
E: last-child 匹配父元素中最后一个子元素E
E: nth-child(n) 匹配父元素中的第n个子元素E
E: first-of-type 指定类型E的第一个
E: last-of-type 指定类型E的最后一个
E: nth-of-type(n) 指定类型E的第n个

nth-child 和 nth-of-type的区别：

  1. ul li:nth-child(3)：选择时，不跳过父元素下的其他元素，选择排序第三个
  2. ，当选择的目标不是
  3. 则不生效
  4. ul li:nth-of-type(3) ：选择时，跳过父元素下的其他元素，选择
  6. !important 不管加在之前的样式上面加了什么同样的样式 !important覆盖之前样式

nth-child ( ‘n’ ) 选择某个父元素的一个或多个特定的子元素

  • n 可以是数字，关键字或者公式
  • n 如果是1，就是选择器第1个子元素
  • n 可以是关键字： even 偶数，odd 奇数
  • n 可以是公式：常见的公式如下（如果n 是公式，则从0开始计算，但是第0个元素或超出了元素的个数会被忽略） | 公式 | 取值 | | —- | —- | | 2n | 选择偶数 | | 2n+1 | 选择奇数 | | 5n | 选择 5、10、15… | | n+5 | 从第五个开始选择 到最后 | | -n+5 | 选择前五个 |

小结：

  • 如果是无序列表，用nth-child居多
  • 类选择器、属性选择器、伪类选择器，权重为10