Bootstrap 3选项卡悬停样式问题

Question

我有一个问题“合并”这两种悬停样式一起执行，如果有人可以看看会很棒。

http://jsfiddle.net/H8vUW/

我需要这些悬停：

.services-icon:hover {
color: #fff;
cursor: pointer;
}

.services-icon-holder:hover {
background: #272727;
cursor: pointer;
}

当用户将鼠标悬停在每个标签名称上时进行激活（设计，电子商店，社交等）

此外，通过增加图标的高度和宽度，我可以通过悬停圆圈使图标变为白色，但这对我来说有点笨拙，例如当你将鼠标移到刚开始时图标不会变成白色的圆圈！

以下是有效和悬停的示例：http://aliensix.com/lightningbolt/example.jpg

有效的是箭头，没有箭头悬停。

Answer 1

此处 FIDDLE 。

你必须在持有者的悬停时触发两个css。当您将鼠标悬停在图标上时，这也会自动触发父级的悬停。

.services-icon-holder:hover {
    background: #272727;
    cursor: pointer;
    width: 60px;
    height: 60px;
}

.services-icon-holder:hover .services-icon {
    color: #fff;
    cursor: pointer;
}