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

前端之家收集整理的这篇文章主要介绍了如何使用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/

猜你在找的CSS相关文章