css伪选择器中的：nth child（1）和：first child之间的区别是什么？选择一种方法优于另一种方法有什么优点吗？

p:n子项（1）{
颜色：红色；
}
p:第一个孩子{
颜色：红色；
}

首先

第二

两者将匹配相同的元素。页面中没有差异：相同的特异性，相同的行为

：第一个孩子

对于人类来说更容易理解，对于我们人类来说是通用的

：第n个孩子（an+b）

n个子项（1）

更易于编程编写/生成。无需在预处理器代码中添加条件来测试“如果它等于1，则输出选择器<代码>：第一个子项<代码>或输出<代码>：第n个子项（变量）”
它显然也必须存在，以及任何其他任意值2，213，等等

---

编辑：fwiw

：第一个字母

和

：第一行

在这些伪类之前就已经存在了，如果没有

：第一个孩子

，当

：n个孩子（an+b）

被创建时：）

基本上是一样的，它做同样的工作，然而，第n个孩子给了你更多的体验空间

比如说

@for $i from 1 through 6 {
  .element:nth-child(#{$i}n) {
    animation-delay: #{$i * 0.05}s;
  }
}

您可以迭代，然后直接使用它来选择孩子。

---

当然，您需要一个预处理器来完成这项工作（

SASS

）

这与

SASS

有什么关系？重复：历史上，在支持

nth-child（）

之前，有一些浏览器支持

first-child

，但现在这不是一个实际问题。