单击引导下拉时更改字体真棒图标

Question

我在引导下拉的标题中有一个字体真棒图标。当我点击下拉菜单时，背景颜色变为绿色，文字颜色变为灰暗阴影。我的问题是，fa-icon也不会改变颜色，因为它具有相同的绿色调，所以它变得“不可见”。如何在按下下拉菜单时更改链接和fa-icon的颜色？ 到问题的网站的链接是：www.jojogames.de/TwoScopes/index.html

在此先感谢。

Answer 1

要更改悬停时的颜色.faicon，请将父母.dropdown:hover与.faicon作为孩子。至于不可见的图标，请在.dropdown.open打开时指定下拉菜单。当然，红色和紫色是占位符颜色，将被替换。

<li class="dropdown><a href="#">Team <i class="fa fa-users faicon"></i></a></li> 

CSS

.faicon { 
    color: #30D31C; 
} 
.dropdown:hover .faicon, 
.dropdown.open .dropdown-toggle:hover .faicon { 
    color: red; 
} 
.dropdown.open .faicon { 
    color: purple; 
}