クリックしてnavbarドロップダウンリストボタンを赤に変えてください

Question

クリックしてフォーカスを合わせた後、ドロップダウンリストボタンを赤くするようにスタイルを設定する方法を理解する必要があります。これがブートストラップかJavaScriptかにかかわらず私は本当に知る必要があります。主な問題は、ナビゲーションバーのドロップダウンリストボタンをクリックするたびに黒にデフォルト設定され、ブートストラップ、JavaScriptなどで変更しようとしたことですが、正直言って運がなかったのです。ここで

<div class="navbar navbar-inverse navbar-fixed-top"> 
    <div class="container"> 
     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
      </button> 
      <a class="navbar-brand" runat="server" href="~/Default.aspx" style="text-align: left; width: 94px; margin-right: 70px;"> 
       <asp:Image ID="Image1" runat="server" ImageUrl="~/icons/FCOTICON.png" Height="55px" Width="110px" /></a> 
      <a class="navbar-brand" runat="server" href="~/Resources/aspx">Resources</a> 
     </div> 
     <div class="navbar-collapse collapse"> 
      <ul class="nav navbar-nav"> 
       <li class="dropdown" style="background-color:red;"> 
        <a href="#" class="dropdown-toggle, navText" data-toggle="dropdown" role="button" aria-expanded="true" style="color: #2A4B7B;">Apps<span class="caret"></span></a> 
        <ul class="dropdown-menu" role="menu" style="overflow-y: scroll;"> 
         <li><a href="">Cisco Wireless</a></li> 
         <li class="divider"></li> 
         <li><a href="">DMS</a></li> 
         <li class="divider"></li> 
        </ul> 
       </li> 
      </ul> 
     </div> 
    </div> 
</div> 

より良い私の問題を説明する2枚の画像があります。

最初の画像はクリックする前の画像で、マウスはボタンの上にだけ表示されます。ボタンを赤くするだけではなく、ボタンをクリックしてボタンに注目した後でなければなりません。私はそれを黒にするときの色のデフォルトをクリックした後

この第2の画像があります。

Answer 1

ブートストラップは、あなたのスタイルをオーバーライドしています。あなたのsite.cssで

、置く：

.navbar-inverse .navbar-nav > li, 
.navbar-inverse .navbar-nav > .open > a, 
.navbar-inverse .navbar-nav > .open > a:hover, 
.navbar-inverse .navbar-nav > .open > a:focus { 
    background-color: red; 
} 

site.cssファイルが_Layout.cshtmlファイルにbootstrap.cssファイルの後に来ることを確認してください。