data-toggle =クリック時の「ドロップダウン」色

Question

データバーのトグル=「ドロップダウン」がナビバーに表示されていることを理解しようとしています。ナビゲーションリンクをクリックすると、ホバー上のメニューとは異なり、メニューは開いたままになります。 （私が間違っている場合は私を修正してください）私の初歩的な知識には、リンクをアクティブなリンクに変更しますか？

これは、出版物であるnavbarリンクをクリックすると下のコードに基づいて、ハイライトされたままになります。このハイライトの色を変更するにはどうすればよいですか？

私はどのようなCSSのブートストラップを編集しますか？

ありがとうございます！

更新：

が

.dropdown-トグルを使用して：フォーカス{色：赤;テキスト装飾：なし;}

自身では動作しません、私は 'を追加する必要がありますそれ以外の場合は効果がありません。おそらくブートストラップコードと衝突しますか？また、私が実際にやっているのはテキストの色ではなく背景の色です。背景を使って：私のために色が全く機能しません。

<li class="dropdown"> 
 
    <a href="#" class="dropdown-toggle" data-toggle="dropdown">Publications</a> 
 
    <ul class="dropdown-menu"> 
 
    <li><a href="submissions.html">Submissions</a></li> 
 
    <li><a href="news.html">News</a></li> 
 
    <li><a href="coc.html">Code of Conduct</a></li> 
 
    <li><a href="links.html">Useful Links</a></li> 
 
    </ul> 
 
</li>

Answer 1

私はあなたのdropdownが開いてまで滞在する色を探しているなら、あなたはfocus

.dropdown-toggle:focus { 
    color:red; 
    text-decoration: none; 
} 

擬似を使用する必要があり、あなたが変更するために探している場合は、前提としhoverでは、以下のコードを使用して行うことができます。

.dropdown-toggle:hover{ 
    color: green; 
    text-decoration: none; 
} 

以下の例のように表示されます。 hoverで

それは​​だとfocusにそれがred

---

.dropdown-toggle:focus { 
 
    color: red; 
 
    text-decoration: none; 
 
} 
 

 
.dropdown-toggle:hover { 
 
    color: green; 
 
    text-decoration: none; 
 
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 

 
<li class="dropdown"> 
 
    <a href="#" class="dropdown-toggle" data-toggle="dropdown">Publications</a> 
 
    <ul class="dropdown-menu"> 
 
    <li><a href="submissions.html">Submissions</a></li> 
 
    <li><a href="news.html">News</a></li> 
 
    <li><a href="coc.html">Code of Conduct</a></li> 
 
    <li><a href="links.html">Useful Links</a></li> 
 
    </ul> 
 
</li>