CSS：如何选择 div 的特定通用孙子？

Question

我正在尝试选择 div 的特定和直接子代的特定和直接子代（我不知道还能怎么说）。但是，在这两种情况下，元素可以是任何内容，因此我需要使用“*”通用符号来选择这些元素。

这可能已经很清楚了，这就是我所拥有的：

.some-div>*:nth-child(2)>*:nth-child(1){
  background-color: #d3fba9;
}
.some-div>*:nth-child(2)>*:nth-child(2){
  background-color: #d3ffe9;
}
.some-div>*:nth-child(2)>*:nth-child(3){
  background-color: #d3fac9;
}

正如你所看到的，我需要选择 div 的第二个子元素的 1-3 个子元素，并对它们应用样式。是否有可能做到这一点？

Answer 1

是的。星号*是多余的，因为您已经为该特定元素（ 的子元素和孙元素）准备了一些说明符.some-div。

• .some-div > :nth-child(2) > :nth-child(1)- 选择 的第二个子项的第一个子项.some-div。
• .some-div > :nth-child(2) > :nth-child(2)- 选择 的第二个子项的第二个子项.some-div。
• .some-div > :nth-child(2) > :nth-child(3)- 选择 的第二个孩子的第三个孩子.some-div。