Html 如何拥有一个类似于Twitter引导上的导航栏'；s网站

我们如何创建一个类似于Twitter Boostrap网站上的导航栏？Navar是黑色的，更重要的是集中在页面的中间。链接的对齐似乎也太高了

使用以下代码创建的导航栏向左对齐。你如何让它以最大宽度居中，就像推特引导网站上的一样

目标导航栏

尝试

<div class="navbar navbar-fixed-top navbar-inverse">
    <div class="navbar-inner">
    <a class="brand" href="#">Bootstrap</a>
    <ul class="nav">
        <li class="active"><a href="#">Home</a></li>
        <li><a href="#">Get Started</a></li>
        <li><a href="#">Scaffolding</a></li>
        </ul>
    </div>
</div>

您需要将所有内容都放在

导航栏内部

的

我喜欢的一种将链接始终对准中心的好方法是使用线条高度：

.navbar-inner { height: 60px; }
.nav { line-height: 60px; }

使其与容器div的高度相同，无论是放置在.navbar内部还是.nav是您的呼叫。但是它会使链接的文本总是在中间垂直对齐。

使用引导框架，.navbar-inner应该应用与.container或.container-fluid相同的css（取决于是否使用流体布局）。对于非流体布局，这意味着以下规则：

.navbar-inner {
    margin: 0 auto;
    width: 1140px; /* or whatever width you choose for your .container */
}

这意味着： .导航栏内部{ 填充：0 20px；

---

}

如果您想知道某个特定站点是如何完成某项任务的。试着看看他们的代码。右键单击并点击查看页面源。使用酱汁，Luke，更具体地说，您可以在JSFIDLE或cssdesk上创建吗？