CSS：hover仅适用于第一个类实例

Question

.Row:hover .Contents  { background-color:Blue; }

<div class="Row">
   <span class="Contents">Row Contents</span>
</div>
<div class="Row">
    <span class="Contents">Row Contents</span>
</div>

在上面的示例中，只有第一行内容响应悬停。见http://jsfiddle.net/3JRTQ/。我不确定我做错了什么，特别是因为.Row .Contents {}适用于所有实例。

我不想突出整行 - 只是带有文字的跨度，但我希望整行响应悬停。

这只能用CSS吗？

Answer 1

你已经点击了bug in Chrome 25 (and 26, too)。请记住，请务必尝试其他浏览器。

Answer 2

修复此示例。使Span成为悬停

.Row .Contents:hover  { background-color:Blue; }

或者将Div作为将要改变的元素：

.Row:hover { background-color:Blue; }

希望这有帮助