gpt4 book ai didi

html - 如何使用CSS将导航栏居中

转载 作者:行者123 更新时间:2023-11-28 06:12:00 24 4
gpt4 key购买 nike

我一直在学习使用 bootstrap,所以我决定用它来创建一个 Navbar。所以,我决定尝试将它居中,所以我在网上寻找解决方案,但没有一个有效。所以请你告诉我该怎么做。

HTML:

</head>
<body>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Items <span class="sr-only"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Item 1</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Item 2 </a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Item 3</a></li>
</ul></li>
</ul>
</div>

Current CSS:
.navbar .navbar-nav {
display: inline-block;
float: none;
vertical-align: top;
}

.navbar .navbar-collapse {
text-align: center;
}

最佳答案

看起来您拥有的 CSS 和代码可以正常工作。只需将您的 div 包裹在导航元素中即可。

<nav class="navbar navbar-default" role="navigation">
<div class="collapse navbar-collapse">
... Rest of Your Code ...
</div>
</nav>

关于html - 如何使用CSS将导航栏居中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36111972/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com