ブートストラップのドロップダウンがクリックされたときにフォントをすばらしいアイコンに変更する

Question

ブートストラップのドロップダウンのタイトルにフォントの素晴らしいアイコンがあります。ドロップダウンをクリックすると、背景色が緑色に変わり、テキストの色が濃いグレーの色に変わります。私の問題は、ファーアイコンは色も変わらず、同じ色合いの緑色なので「見えない」ということです。ドロップダウンを押すと、リンクとファーアイコンの色をどのように変更できますか？ 問題のあるサイトへのリンク：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; 
}