2017-08-27 58 views
0

我在html中使用引導類來創建導航欄的簡單代碼。我希望我的導航欄是水平的,所以我添加了navbar-inverse類。不過,我的導航欄仍然顯示垂直,我不明白爲什麼這樣做,即使我認爲我嘗試了不同的事情來做到這一點。Navbar-inverse不起作用

<div class="blog-masthead"> 
     <div class="container"> 
      <nav class="navbar navbar-inverse"> 

       <ul class="nav navbar-nav"> 
        <li class="nav-item"><a class="blog-nav-item active" href="#">Home</a></li> 
        <li class="nav-item"><a class="blog-nav-item" href="#">New features</a></li> 

       </ul> 

       <ul class="nav navbar-nav navbar-right"> 
        <li class="nav-item"><a class="blog-nav-item" href="#">{{ Auth::user()->name }}</a></li> 
       </ul> 

      </nav> 
     </div> 
</div> 
+0

您發佈不會做你的描述的代碼。 https://www.bootply.com/ZvDycROXEW。請在您的問題中發佈[mcve] – j08691

+0

navbar-inverse在默認灰色主題上提供備用顏色方案。它不會影響元素的垂直或水平對齊。請更新使用的CSS和相關的代碼以進一步幫助。 – pratikpawar

+0

@joan你的代碼似乎工作正常。我相信一些CSS重寫引導CSS或檢查引導程序是否包含正確。 – pratikpawar

回答

0

我希望導航欄逆是無關的菜單顯示風格,我希望它是用來改變菜單文本的顏色和視圖樣式,你應該在標籤和導航,可切換使用導航鏈接在導航標籤中,我希望這是答案。

對不起,如果我誤解你的問題

   <ul class="nav navbar-nav "> 
       <li class="nav-item"> 
        <a class="nav-link active" href="#">Home</a> 
       </li> 
       <li class="nav-item"> 
        <a class="nav-link " href="#">New features</a> 
       </li> 

       </ul> 

       <ul class="nav navbar-nav navbar-right"> 
       <li class="nav-item"><a class="nav-item" href="#">{{ Auth::user()->name }}</a></li> 
       </ul> 

     </nav> 
    </div>