嘿,我需要进行一些样式设置,但我不确定如何在没有js的情况下使用常规css完成。
我的html代码如下:
<div class="book"> <span class="title">Snow Crash</span> <span class="author">Neal Stephenson</span> </div>
我的css代码如下:
div.book span.title { color: black; } div.book span.author { color: gray; } div.book:hover { color: orange; }
我希望当鼠标悬停在div上时,标题和作者都变成橙色,即使它们通常是不同的颜色。由于它们已经有自己的颜色设置,所以这些span元素不会继承div元素的颜色属性,并且只有当你悬停在span元素上时,它们才会触发hover事件。我能否在不使用javascript的情况下实现这个效果?
div.book:hover span.title { color: orange; }
不起作用吗?你确定 div 位于其下方吗? - Mark Baijensdiv.class
中指定div
。这只会增加CSS特异性的负担。在某些情况下是有意义的(例如当你遇到span.title
和div.title
之类的问题时)。 - zzzzBov