如何中心對齊導航欄

我想使用的導航我的頁腳，就像它是如何被用作默認的ASP.NET MVC應用程序的標準菜單。造型看起來不錯，它對我來說很有意義，所以堅持這種配置會很好。我如何在不修改CSS的情況下對其進行對中？我擔心的是，由於頭部採用class="nav navbar-nav"爲好，如果我調整了nav CSS說text-align:center;會搞亂我的主菜單頁面的頂部。任何建議？如何中心對齊導航欄

注：我知道我已經使用類似style="text-align:center;"合理以前我的主導航欄菜單項，但是我不記得如何。

<footer> 
     <div class="container-fluid"> //Necessary? 
      <div class="row"> //Necessary? 
       <div class="col-md-12"> //Necessary? 
         <ul class="nav navbar-nav" style="text-align:center;"> //Trying to adjust the style to center align 
          <li class="dropdown"> 
           <a class="dropdown-toggle" role="button" aria-expanded="false" href="#" data-toggle="dropdown">Home <span class="caret"></span></a> 
           <ul class="dropdown-menu" role="menu"> 
            <li>@Html.ActionLink("Item 1", "Index", "Home", protocol: null, hostName: null, fragment: "item1", routeValues: null, htmlAttributes: null)</li> 
            <li>@Html.ActionLink("Item 2", "Index", "Home", protocol: null, hostName: null, fragment: "item2", routeValues: null, htmlAttributes: null)</li> 
            <li>@Html.ActionLink("Item 3", "Index", "Home", protocol: null, hostName: null, fragment: "item3", routeValues: null, htmlAttributes: null)</li> 
           </ul> 
          </li> 
          <li>@Html.ActionLink("About", "About", "Home")</li> 
          <li>@Html.ActionLink("Contact", "Contact", "Home")</li> 
         </ul> 
       </div> 
      </div> 
     </div> 
</footer>

編輯：

我發現，在<ul>標籤做了以下創建基本導航欄

<ul class="nav navbar-nav">

同樣的外觀和感覺，也有navbar-left和navbar-right類這證明了左右導航欄的正確性，但沒有中心。有關創建navbar-center的任何建議？

來源

2015-09-06 Matthew

如果可以訪問你的CSS，

footer ul li { 
text-align:center; 
}

或HTML

<div class="row" style="text-align:center;">

Fiddle

來源

2015-09-06 17:55:08

這對我來說不起作用 – Matthew

Golden Ball：footer .container-fluid {margin：0 auto;文本對齊：中心;};它只有在你確定了容器流體的寬度或者使用％來處理條形時纔會起作用。 –

試試這個代碼？設置div的寬度爲導航欄的寬度<div class="col-md-12" style="margin-left:auto;margin-right:auto;width:___;">

來源

2015-09-06 17:57:12

如何中心對齊導航欄

回答

相關問題