Bootstrap - 帶有標籤的頂部導航欄

Question

我想將表格結構合併到我的Bootstrap導航欄中。目前我有以下設置：

<div class="navbar navbar-inverse navbar-static-top"> 

     <div class="container-fluid"> 
     <div class="navbar-header"> 
      <div class="navbar-brand"> 
      <i class="fa fa-cog"></i> Settings 
      </div> 
     </div> 
     <div class="container collapse navbar-collapse"> 
      <ul class="nav nav-tabs "> 
      <li><a href="#/menu1">MENU-ITEMS1</a></li> 
      <li><a href="#/menu2">MENU-ITEMS2</a></li> 
      <li><a href="#/menu3">MENU-ITEMS3</a></li> 
      <li><a href="#/menu4">MENU-ITEMS4</a></li> 
      </ul> 
     </div> 
     </div> 
    </div> 

我得到我的標籤在頂部垂直對齊，但是我需要他們在我的導航欄的底部。

以下Bootply演示了此問題： http://www.bootply.com/ouKLqFBeqj

Answer 1

這裏是一個Codepen你可以檢查出http://codepen.io/noobskie/pen/rOVaKV

所有香港專業教育學院做結合，從我張貼在評論鏈接修復Twitter Bootstrap: Align nav-tabs to bottom of div

基本上所有你需要做的是將position:relative類添加到你的標籤的父div，然後在你的標籤列表中添加 position:absolute; bottom:0; 和你的情況我補充left:95因爲你的導航欄鏈接