ユーザーがクリックしたときにナビゲーションバーアイテムの色を変更するにはどうすればいいですか？

Question

私はあなたの上に置いたときに私のnavbarの最初のレベルの項目をピンクに変更するタスクがあり、2番目のものはデフォルトではピンク、私はそれらをホバーすると青になるはずです。

実際には、第1レベルのホバリングされた色の色は変化せず、第2の無色の色は変わらず、第2ホバリングの色は変化しない。ここ

は私のコードです：

html .nav .item .dropdown, 
body .nav .item .dropdown, 
html .nav .item .dropdown-menu, 
body .nav .item .dropdown-menu { 
    background-color: HotPink; 
} 

html .nav .item .dropdown .active:hover, 
body .nav .item .dropdown .active:hover, 
html .nav .item .dropdown-menu .active:hover, 
body .nav .item .dropdown-menu .active:hover, 
html .nav .item .dropdown .inside_item, 
body .nav .item .dropdown .inside_item, 
html .nav .item .dropdown-menu .inside_item, 
body .nav .item .dropdown-menu .inside_item { 
    text-transform: none; 
} 
html .nav .item .dropdown .active:hover:hover, 
body .nav .item .dropdown .active:hover:hover, 
html .nav .item .dropdown-menu .active:hover:hover, 
body .nav .item .dropdown-menu .active:hover:hover, 
html .nav .item .dropdown .inside_item:hover, 
body .nav .item .dropdown .inside_item:hover, 
html .nav .item .dropdown-menu .inside_item:hover, 
body .nav .item .dropdown-menu .inside_item:hover { 
    background-color: lightSkyBlue; 

それらを動作させるために何をしますか？

Answer 1

これはかなり単純で簡単です。

これは次のようになります。

/*通常の状態*/

.dropdown { 
background-color: //color; 
} 

あなたはあなたが追加置くとドロップダウンの色を変更したい場合は、

.dropdown:hover { 
background-color: //color; 
} 

レベルを上げると、

.dropdown .active { 
//color 
} 

ホバーでbg-colorを変更する場合は、

.dropdown .active:hover { 
//color}