如何將導航欄中的按鈕居中？

我應該怎麼做才能對齊酒吧中心的前3個按鈕？

#navbar{ 
    list-style-type: none; 
    position: relative; 
    top: -4px; 
    padding: 0; 
    margin: 0; 
    overflow: hidden; 
    background-color: #212121; 
}

來源

2016-10-08 Toma Radu-Petrescu

提供了你擁有的任何一個小提琴嗎？ – Siddharth

你可以做的是將左邊的按鈕放在div中，然後簡單地添加'margin：0 auto;'。 –

在您的導航欄，你可以把這些在一個三個獨立的格，然後對齊到中心

來源

2016-10-08 19:53:43

你好朋友居中，你菜單選項（NAV），你只需要使用文本規則：中心; ，爲什麼？因爲菜單列表中通過「」禮「」或「」 UL'形成，我們僅適用此規則列出和準備:)，來自墨西哥的問候;）

來源

2016-10-08 19:58:43 Sommer

<html> 

<head> 
    <style> 
     body{ 
      margin: 0px; 
     } 
     .navbar{ 
      height: 60px; 
      background-color: #bbb; 
      line-height: 60px; //this will center inline elements in your navbar 
     } 
     .container{ 
      margin-left: 5%; 
      margin-right: 5%; 
     } 
     .btn{ 
      background-color: white; 
      padding: 10px 20px; 
      width: 100px; 
      border: none; 
      border-radius: 2px; 
      display: inline; 
     } 
     .nav{ 
      display: inline; 
      list-style-type: none; 
     } 
     .nav li{ 
      display: inline; 
     } 
    </style> 
</head> 
<body> 
    <!--Navbar--> 
    <nav class="navbar"> 
     <div class="container"> 
      <ul class="nav"> 
       <li><button class="btn">Button1</button></li> 
       <li><button class="btn">Button2</button></li> 
       <li><a class="btn">&lt;a&gt; Button</a></li> 
      </ul> 
     </div> 
    </nav> 
</body>

上面的代碼應該適合你。我已經顯示了使用錨標記和按鈕標記的按鈕

來源

2016-10-08 20:10:29

如何將導航欄中的按鈕居中？

回答

相關問題