2015-06-15 60 views
0

我是引導程序的新用戶,並且想要更改導航欄中項目的顏色。更改導航欄「Bootstrap」中的文本顏色

已經創建了我自己的名爲Site.CSS的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 ,您可以添加一個ID,並使用更具體的規則覆蓋Bootstrap CSS。但是,如果你已經正確配置了CSS,並且在bootstrap css文件後加載了Site.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; 
} 

`