引導3活動菜單狀態顏色

這可能很簡單，但我似乎無法完成我所需要的。引導3活動菜單狀態顏色

基本上，我希望當問題頁面處於活動狀態時，顏色改變爲其他值，而不是引導程序的默認藍色。

我已經嘗試了許多不同的CSS，但是這是我目前的：

ul.nav a:active { 
    background-color: #3366CC !important; 
}

，即時通訊使用的導航欄是如下：

  <nav class="navbar navbar-default navbar-static-top" role="navigation"> 
      <div class="container-fluid"> 
      <!-- Brand and toggle get grouped for better mobile display --> 
      <div class="navbar-header"> 
       <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> 
       <span class="sr-only">Toggle navigation</span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       </button> 
      </div> 

      <!-- Collect the nav links, forms, and other content for toggling --> 
      <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> 
       <ul class="nav nav-pills nav-justified fixed-top"> 
       <li class="active"><a href="">Home</a></li>

等

有一個簡單的CSS規則，我錯過了，顏色改變相當自由爲我的其他菜單需求，如：

ul.nav { 
    padding: 5px; 
} 

ul.nav li a { 
    color: #fff; 
} 

ul.nav li a:hover{ 
    color: #CC0033 !important; 
} 

ul.nav a:hover { 
    background-color: #fff !important; 
}

任何幫助將不勝感激！

來源

2014-10-17 Dog124

我會迴避使用'！important'。 – hungerstar 2014-10-17 15:23:30

你只需要的顏色與活動類

ul.nav li.active a { 
    background-color: #3366CC !important; 
}

來源

2014-10-17 15:12:36

這工作。謝謝你，我很接近！ – Dog124 2014-10-17 15:26:19

的添加到一個標籤裏內：積極僞類，只有當，例如，用戶在點擊的過程相匹配在鏈接上： https://developer.mozilla.org/en-US/docs/Web/CSS/:active 它不指示哪個頁面處於活動狀態。

在引導所述頁/部分當前處於活動狀態由活性類上裏信號通知。在Bootstrap 3中，請嘗試：

.nav > .active { 
    background-color: #3366CC; 
}

使用Inspect Element可以找出實際應用的樣式，因此您可以正確覆蓋它。

來源

2014-10-17 15:22:42 zeroviscosity

引導3活動菜單狀態顏色

回答

相關問題