CSS Hover属性在子元素而不是整个元素上

时间:2009-11-11 23:23:37

标签: css hover element

希望这是有道理的 - 我的html如下

HTML

<a href="#" class="someclass">An <span class="sub">Interesting</span> Link</a>

其中css只是颜色信息。我想要做的就是这样做,当你将鼠标悬停在整个链接上时,只有“子”信息受到悬停属性的影响。虽然这在javascript中很容易做到,但我很好奇css是否允许这种行为。如果我试着写这个可能看起来像

a:hover{
    .sub{color:newcolor};
}
然而,我从来没有见过这样的东西,显然它不起作用

2 个答案:

答案 0 :(得分:12)

a:hover .sub { color: newcolor }

答案 1 :(得分:4)

像这样:

a:hover .sub { color: #f00; }

如果您只需要将它应用于该特定类:

a.someclass:hover .sub { color: #f00; }