Twitter bootstrap 3 如何让一个无序的列表有一个字体很棒的图标和列表文本，从而在引导中具有相同的悬停状态？

我正在学习Bootstrap，有几个问题我似乎找不到答案。不过我会一次问一个问题。我的第一个问题：

我正在尝试创建一个无序列表，其中图标和一些文本相邻。我希望文本和图标同时更改其悬停状态。但是，我似乎只能将图标或文本突出显示或我可以将两者都突出显示，但不能同时突出显示。理想情况下，如果用户将鼠标悬停在文本上，图标也会改变鼠标悬停状态，反之亦然。有人能看一下JSFIDLE上的代码并告诉我我做错了什么吗

非常感谢你的帮助。谢谢

---

PS：我希望我按照要求正确插入了代码。这是我的第一篇文章，如果插入错误，请告诉我。

这个问题与引导无关。这是关于css优先级规则的。您按类别为图标指定了颜色

.right-circle-icon {
    font-size: 18pt;
    padding: 10px 10px 0 15px;
    color: #808080; <--
}

对于icon元素，第一条规则更为严格，因此它从中获取颜色（即使将鼠标悬停在锚定父元素上）。若你们从右圆圈图标中移除颜色，那个么任何锚元素上的鼠标悬停也应该给图标赋予鼠标悬停的颜色

如果您不想从右圆圈图标中删除颜色，则应添加

.btn-list:hover .right-circle-icon{
        color: #963050;
    }

在任何情况下你都不需要

.right-circle-icon:hover {
    color: #963050;
}

---

非常感谢。我没有意识到图标元素。

.btn-list:hover .right-circle-icon{
        color: #963050;
    }

.right-circle-icon:hover {
    color: #963050;
}