是否可以使第n个子级伪选择器与特定类一起使用？
我想让第二个DIV.red变成红色，但是它没有应用预期的颜色。
不仅如此，当您指定它时，它会将第5个DIV更改为红色：
div.red:nth-child(6)
指定此选项后，它将第8个DIV更改为红色：
div.red:nth-child(9)
它似乎落后了一个DIV。该示例中只有8个DIV标签，所以我不知道为什么nth-child（9）甚至可以工作。使用Firefox 3.6进行测试，但在我的实际生产代码中，Chrome中出现了相同的问题。我不了解应该如何工作，请澄清一下。
同样，这会将第6个DIV更改为红色，但是我真正想要的是将第2个DIV.red更改为红色：
div.red:nth-of-type(6)
而且我不明白为什么nth-child（）和nth-of-type（）会有不同的响应，因为在文档中只有八个相同类型的标签。
由于没有:nth-of-class()选择器，因此无法在CSS中按类进行过滤。解决此问题的一种方法是将两种不同的divs放入自己的组，然后根据这些组进行选择。例如：
:nth-of-class()
div
<div class="orange"> <div></div> <div></div> <div></div> <div></div> </div> <div class="red"> <div></div> <div></div> <div></div> <div></div> </div>
使用此选择器：
div.red div:nth-child(2) { background: red; }
关于您的问题的最后一点：
对于您提供的代码， 应该没有 任何区别。我对其进行了测试，并且两个伪类均按预期工作。但是，通常：
:nth-child()在兄弟姐妹的整个级别上操作，而不考虑其他任何简单的选择器。然后，如果第n个孩子不在简单选择器匹配的对象中，则不匹配任何内容。
:nth-child()
:nth-of- type()在给定类型的同级对象上进行操作，而无需考虑其他简单选择器。然后，如果该类型的第n个元素不在简单选择器匹配的元素之中，则不匹配任何内容。
:nth-of- type()
