Почему nth-of-type и nth-child так себя ведут?

Question

[arpeggio]

Есть такая структура:

<ul>
 <li class='class1'></li>
 <li class='class2'></li>
 <li class='class1'></li>
 <li class='class2'></li>
 <li class='class1'></li>
</ul>

если писать селекторы так:

.class1:nth-child(1) {
 background: #aaa;
}
.class1:nth-child(2) {
 background: #bbb;
}
.class1:nth-child(3) {
 background: #ccc;
}

или

.class1:nth-of-type(1) {
 background: #aaa;
}
.class1:nth-of-type(2) {
 background: #bbb;
}
.class1:nth-of-type(3) {
 background: #ccc;
}

то эти селекторы будут применяться не к лишкам с классом class1, а просто ко всем поочереди лишкам, неважно, какой у них класс. Причём такое поведение и в хроме и в мозилле, видать спека такая, но это как-то нелогично.
Может кто-то объяснить такое поведение селекторов?

Answer 1

[Ankhena]

:nth-of-type выбирает дочерние элементы своего родителя указанного типа
тип у элементов один - это li, а класс это класс, а не тип.
соответственно в вашем случае nth-child и nth-of-type идентичны