该
nth-child伪类指的是“第N个匹配的子元素”，如果你有一个结构如下含义：
<div> <h1>Hello</h1> <p>Paragraph</p> <p>Target</p></div>
然后
p:nth-child(2)将选择第二个也是ap的孩子（即
p带有“ Paragraph”的）。
p:nth-of-type将选择第二个 匹配的
p元素（即我们的Target
p）。
您之所以中断，是因为type是指元素的类型（即
div），但是第一个div与您提到的规则（
.row .label）不匹配，因此该规则不适用。
原因是，CSS是从右到左解析的，这意味着浏览器首先在上查找
:nth-of-type(1)，确定它搜索type的元素
div，这也是该类型
.row的第一个元素，该元素与第一个
.icon元素相匹配。然后，它会读取该元素应具有的
.label类，该类与上述任何内容都不匹配。
如果要选择第一个label元素，则需要将所有标签包装在它们自己的容器中，或者简单地使用
nth-of-type(3)（假设总会有2个图标）。
另一个选择是（悲伤地）使用…等待… jQuery：
$(function () { $('.row .label:first') .css({ backgroundColor:"blue" });});
