nth-child不响应类选择器

nth-child不响应类选择器

尝试使用

:nth-of-type()

伪选择器：

#content .foo:nth-of-type(1) { margin-top: 0; }

请注意，

:nth-of-type()

计数具有相同名称的元素。因此，

.foo:nth-of-type(1)

将不会选择具有 foo
类的第一个元素，而是选择按相同名称分组的元素列表中第一个元素的第一个元素。如果您有这样的文件：

<div>    <i >1</i><i>x</i><i >2</i>    <b >3</b><b>x</b><b >4</b></div>

.foo:nth-of-type(1)

将选择元素

<i >1</i>

，

<b>3</b>

并且两者都是其自身的第一个类型。