2015-06-15 8 views
0

Я новый пользователь для начальной загрузки и хочу изменить цвет элементов в панели навигации.Изменить цвет текста в строке навигации «Bootstrap»

Создал собственный файл css под названием Site.CSS, но также имеет файл bootstrap.css. В настоящий момент цвет текста заголовка «Главная, бронирование, контакт, вход и регистрация» серый. Когда вы поднимаетесь над ним, он становится белым.

Я хочу, чтобы он был белым, как стандарт, и менял его на серый, когда вы обнимаете его с помощью мыши.

Часть кода у меня есть на главной странице:

<form id="form" runat="server"> 
<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">M-Hotels</a> 
      </div> 
      <div class="navbar-collapse collapse"> 
       <ul class="nav navbar-nav"> 
        <li><a runat="server" href="~/default.aspx">Home</a></li> 
        <li><a runat="server" href="~/Booking.aspx">Booking</a></li> 
        <li><a runat="server" href="~/Contact.aspx">Contact</a></li> 
       </ul> 
       <asp:LoginView runat="server" ViewStateMode="Disabled"> 
        <AnonymousTemplate> 
         <ul class="nav navbar-nav navbar-right"> 
          <li><a runat="server" href="~/Registration.aspx">Register</a></li> 
          <li><a runat="server" href="~/Login.aspx">Log in</a></li> 
         </ul> 
        </AnonymousTemplate> 
        <LoggedInTemplate> 
         <ul class="nav navbar-nav navbar-right"> 
          <li> 
           <a runat="server" href="~/User.aspx" title="Manage your account">Hello,!</a> 
          </li> 
          <li> 
           <a runat="server" href="~/default.aspx" title="Log out"></a> 
          </li> 
         </ul> 
        </LoggedInTemplate> 
       </asp:LoginView> 
      </div> 
     </div> 
    </div> 
    <div class="container body-content"> 
     <asp:ContentPlaceHolder ID="MainContent" runat="server"> 
     </asp:ContentPlaceHolder> 
     <hr /> 
     <footer> 
      <p>&copy; <%: DateTime.Now.Year %> - M-Hotels A/S</p> 
     </footer> 
    </div> 
</form> 

Может ли сказать мне, если я должен что-то изменить в файле загрузки или если я должен что-то добавить в файл site.css ,

+0

На каждом ul.nav , вы можете добавить идентификатор и переопределить CSS Bootstrap, используя более конкретное правило. Однако, если вы правильно настроили CSS и загрузили файл Site.css ПОСЛЕ загрузочного файла css, тогда он должен работать нормально! У вас есть пример вашего CSS для панели навигации? –

ответ

3

Вы можете добавить этот код в файле site.css

.nav.navbar-nav li a { 
    color: #fff; 
} 

.nav.navbar-nav a:hover { 
color: grey; 
} 
+0

Это не работает – Mikkel

+0

Это работает для меня .. –

+0

Не работает вообще. –

0

Вы должны что-то добавить к вашему site.css Что, вероятно, происходит, что стили бутстраповские перезаписи, что вы пишете. В этом случае вам нужно увеличить Специфичность

0

попробовать этот

.nav.navbar-nav li a { 
    color: #fff !important; 
} 
.nav .navbar-nav li a:hover { 
    color: grey !important; 
} 
+0

Приятно, что это сработает. –

0

Это старый вопрос, но это то, что работает для меня:

a { 
color: #536872; 
text-decoration: none; 
background-color: transparent; 
} 

`

Смежные вопросы