bootstrap導航欄項目在丟失焦點時顏色發生變化

Question

我的引導菜單欄中存在以下問題： 當我點擊「登錄」，然後單擊「En」鏈接時，登錄鏈接變黑。

我已經設置背景顏色爲#ee4035 我也嘗試了懸停/焦點屬性。

關於我錯過了什麼的想法？

這裏是我的HTML的副本： https://jsfiddle.net/ebj2zt72/

感謝

<style> 
    .navbar { 
    min-height: 80px; 
    background: #ee4035; 
    border-width: 0px; 
    border-radius: 0px; 
    color: blue; 
    } 

    .navbar a { 
    color: white!important; 
    } 

    .navbar-brand { 
    padding: 0 15px; 
    height: 80px; 
    line-height: 80px; 
    color: white; 
    } 

    .navbar-toggle { 
    /* (80px - button height 34px)/2 = 23px */ 
    margin-top: 23px; 
    padding: 9px 10px !important; 
    } 

    .navbar-btn { 
    /* (80px - button height 34px)/2 = 23px */ 
    margin-top: 18px; 
    margin-right: 30px; 
    padding: 9px 10px !important; 
    background: #f37736; 
    border-width: 0px; 
    } 

    .navbar-text { 
    margin-top: 28px; 
    color: white; 
    } 

    .nav.navbar-nav.navbar-right li a { 
    color: white; 
    } 

    .dropdown-menu { 
    background: #ee4035; 
    } 

    .dropdown-menu > li > a:hover, 
    .dropdown-menu > li > a:focus { 
    background-color: #d6392f; 
    } 

    .navbar-inverse .navbar-nav > li.dropdown:hover > a, 
    .navbar-inverse .navbar-nav > li.dropdown:hover > a:hover, 
    .navbar-inverse .navbar-nav > li.dropdown:hover > a:focus { 
    background-color: #d6392f; 
    } 
</style> 



<nav class="navbar navbar-inverse"> 
    <div class="container-fluid"> 
    <div class="navbar-header"> 
     <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar"> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     </button> 
     <a class="navbar-brand" href="#">logo</a> 
    </div> 
    <div class="collapse navbar-collapse" id="myNavbar"> 

     <ul class="nav navbar-nav navbar-right"> 
     <li class="inline"> 
      <p class="navbar-text" style="color:white"><strong>goodmorning? </strong></p> 
     </li> 
     <li> 
      <button class="btn btn-danger navbar-btn"> Click me</button> 
     </li> 
     <li class="dropdown"> 
      <a class="dropdown-toggle" id="user-navbar" data-toggle="dropdown" href="#"><span class="glyphicon glyphicon-user"></span> Sign in</a> 
      <ul class="dropdown-menu"> 
      <li><a href="#">A</a></li> 
      <li><a href="#">B</a></li> 
      <li><a href="#">C</a></li> 
      </ul> 
     </li> 
     <li class="dropdown"> 
      <a class="dropdown-toggle" id="lang-selector" data-toggle="dropdown" href="#"><span class="glyphicon glyphicon-globe"></span> En <span class="caret"></span></a> 
      <ul class="dropdown-menu"> 
      <li><a href="#">English</a></li> 
      <li><a href="#">Ellinika</a></li> 
      <li><a href="#">Italian</a></li> 
      </ul> 
     </li> 

     </ul> 
    </div> 
    </div> 
</nav> 

    </body> 

</html> 

Answer 1

，如果你的問題是，你不想讓鏈路變化的或你不換言之顏色當你想要在你的鏈接上看到任何樣式時，你可以通過手動修改相應的類來實現，或者更好地提供內聯樣式（總是儘量避免這樣做）所有您在.css文件中提供的樣式或在樣式標籤下）提供您所需的樣式出現在不同的情況下。 如果你可以讓我更有效地幫助你，那麼請編輯你的jsfiddle文件，因爲它是空的，並且你的問題陳述中沒有太多清楚的。

關於鏈接變黑，直接使用引導類有時會作爲小故障，因爲引導類在引導CSS中設置背景顏色。所以當你切換已經設置的背景顏色時會顯示出來。你將不得不將它設置爲你喜歡的。

例如，如果下拉切換類的默認顏色設置爲background-color：＃111111;和/或＃e5e5e5假設，這就是爲什麼你在懸停時獲得黑暗的顏色。