2016-05-01 14 views
0

Я использовал bootstrap, и я хотел бы изменить активный фон страницы на зеленый, но он не работает.Как изменить активный цвет фона панели навигации?

.navbar-inverse { 
 
    color: #fff; 
 
    background-color: #4CAF50; 
 
}
<nav class="navbar navbar-inverse"> 
 
    <div class="container-fluid"> 
 
    <div class="navbar-header"> 
 
     <div class="logo"> 
 
     <img src="images/logo.png"> 
 
     </div> 
 
    </div> 
 
    <ul class="nav navbar-nav"> 
 
     <li class="active"><a href="index.html">Home</a></li> 
 
     <li><a href="about.html">About</a></li> 
 
     <li><a href="contact.html">Contact</a></li> 
 
    </ul> 
 
    <ul class="nav navbar-nav navbar-right"> 
 
     <li><a href="#"><span class="glyphicon glyphicon-log-in"></span> Logout</a></li> 
 
    </ul> 
 
    </div> 
 
</nav>

Когда я изменить цвет фона в «Осмотрите элемент» он работает как шарм. Я не знаю, что попробовать.

Спасибо!

+0

ли вы имеете в виду, что вы хотите изменить цвет фона активного HREF элемента? Если да, вы можете попробовать следующее: .navbar-inverse .navbar-nav .active a { color: #fff; background-color: # 4CAF50; } –

ответ

0

Я проверил ваш код на своем компьютере, и он отлично работает.

Почему это не работает для вас, я предполагаю, потому что вы связываете свой CSS перед Bootstrap в HTML. Чтобы переопределить CSS Bootstrap, вам нужно связать свой собственный CSS после Bootstrap.

Например:

<link href="bootstrap.css" ...> 
<!-- put your custom css after bootstrap --> 
<link href="my-custom-style.css" ...> 
Смежные вопросы