2016-04-29 220 views
1

enter image description here導航欄在引導

你可以看到圖片,有兩個導航欄,一個有頭和行吟詩人與菜單。他們不適合沒有空間。我嘗試過。請協助。

<nav class="navbar top-color"> 
    <!--nav header Div--> 
    <div class="container-fluid"> 
    <div class="col-sm-2"><a class="navbar-head" style="text-decoration:none; color:white;" href="#"><h1>MY Page</h1></a> 
    </div> 
    </div> 
</nav> 

<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="#">WebSiteName</a> 
    </div> 
    <div class="collapse navbar-collapse" id="myNavbar"> 
     <ul class="nav navbar-nav"> 
     <li class="active"><a href="#">Home</a></li> 
     <li class="dropdown"> 
      <a class="dropdown-toggle" data-toggle="dropdown" href="#">Page 1 <span class="caret"></span></a> 
     </li> 
     <li><a href="#">Page 2</a></li> 
     <li><a href="#">Page 3</a></li> 
     </ul> 
    </div> 
    </div> 
</nav> 

</body> 

</html> 
<style> 
    .top-color { 
    background-color: aquamarine; 
    } 
</style> 
+0

那你想怎樣? –

+0

''後面不能有'style'標籤。 –

回答

2

我想你可以刪除「下邊距」這一類「.navbar.top色」

.navbar.top-color { 
    margin-bottom: 0; 
} 

BOOTPLY DEMO

+0

非常感謝 –