有人可以解释为什么“第n个孩子”选择器具有比“悬停”更高的优先级吗？ [英] Can someone explain why the "nth-child"-selector has a higher priority than "hover"?

问题描述

昨天我碰到这个：我的：hover - 状态之一停止工作。我发现如果我改变这个：

Yesterday I ran into this: One of my :hover-states stopped working. I found out that If I change this:

div.item {}
div.item:hover {}
div.item:nth-child(even) {}

>

to this:

div.item {}
div.item:nth-child(even) {}
div.item:hover {}

它会再次工作。

我已经在jsfiddle上创建了演示以显示这两种情况。

I've created a demo on jsfiddle to show both cases.

可以有人解释为什么：hover -state被选择器覆盖了吗？

Can somebody explain, why the :hover-state is overwritten by the selector?

推荐答案

选择器具有相同的特异性，因此最后一个选择器优先级。

The selectors have the same specificity, so the one that comes last takes priority.

这篇关于有人可以解释为什么“第n个孩子”选择器具有比“悬停”更高的优先级吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！