整个页面中的CSS3 nth-of-type？

Question

在我看来，nth-of-type只能在同一个父元素中工作。有没有办法让它在整个页面上运行？

我的情况：我想循环浏览五种悬停颜色的链接。这些链接分散在许多段落中。由于每个段落只有一个或两个链接，因此前几个悬停颜色不成比例地受到青睐。

谢谢！

Answer 1

nth-of-type总是查看元素相对于它的直接父级的索引：（w3schools），因此它不适用于整个页面。

您最好的选择是使用javascript实现此行为，这是使用JQuery的快速演示：jsfiddle

var styles = ["first", "second", "third"];
var index = 0;
$("body").find("a").each(function() {
    $(this).addClass(styles[index++]);
    if (index >= styles.length) index = 0;
});