如何使用css在悬停时使整个div更改颜色?

我有以下内容
<div id="side-menu" class="sidebar-nav span2">
        <div class="sidebar-link"><span>Link 1</span></div>
        <div class="sidebar-link"><span>Link 2</span></div>
    </div>

当你将鼠标悬停在它们上面时,我试图让两个div中的每一个都改变颜色 – 无论你是否将鼠标悬停在文本右侧或左侧的文本上.目前,只有将鼠标悬停在文本上时,颜色才会发生变化.知道如何做到这一点?这是我对css的小提琴:

http://jsfiddle.net/PTSkR/56/

解决方法

悬停选择器中有空格.这很重要,因为空间是CSS中的后代选择器
div.sidebar-link :hover{
    background-color: #E3E3E3;
}

这意味着只有.sidebar-link的徘徊后代受到规则的影响.删除空间.

http://jsfiddle.net/ExplosionPIlls/PTSkR/57/

相关文章

Css3如何实现鼠标移上变长特效?(图文+视频)
css3怎么实现鼠标悬停图片时缓慢变大效果?(图文+视频)
jquery如何实现点击网页回到顶部效果?(图文+视频)
css3边框阴影效果怎么做?(图文+视频)
css怎么实现圆角边框和圆形效果?(图文+视频教程)
Css3如何实现旋转移动动画特效