在父悬停时更改儿童颜色的更好解决方案

Question

是否有更好的一行crossbrowser解决方案通过CSS改变儿童文本颜色？
需要在悬停div

html 上使所有文本变为红色:

<div><span class="gray">I'm a lion!</span><span>Arrrrr!!!</span></div>

CSS:

div {color:black};
.gray {color:gray;}
div:hover {color:red;}

我只想到这一点

div:hover, div:hover .gray {color:red;}

Answer 1

你自己...

div:hover, div:hover .gray {color:red;}

......真是一个好的解决方案.如果你想匹配其他类/元素,你可以使用一个星;

div:hover, div:hover * { color:red; }

演示http://jsfiddle.net/h5BaU/