我在StackOverflow上已经看到了这种答案，但是没有一个适合我的目的。我想做的是在导航栏中居中显示文本。我见过的所有其他答案都涉及将导航中心居中ul。我想做的是.nav-text在导航栏中将a居中。我试图居中会text-align: center在导航栏几乎每一个元素（上.navbar，.container，.navbar-collapse），但他们没有工作。
的HTML
<div id="navbar" style="opacity: 0;">
<nav class="navbar navbar-default navbar-fixed-top" style="text-align: center;">
<div class="container" style="text-align: center;">
<div class="collapse navbar-collapse" style="text-align: center;">
<ul class="nav navbar-nav">
<li><a href="/">My Website</a></li>
<li><a href="#">About</a></li>
</ul>
<p class='navbar-text text-center' style='text-align: center;'>My Website</p>
<ul class="nav navbar-nav navbar-right">
<p class="navbar-btn"><a href="checkout.php" class="btn btn-success">Continue to checkout <span class='fa fa-arrow-right'></span></a></p>
</ul>
</div>
</div>
</nav>
</div>
这怎么工作？
我认为最好的方法是使用position:absolute。为此创建一个特殊的类，并将该类添加到您的中navbar-text。
.navbar-center
{
position: absolute;
width: 100%;
left: 0;
top: 0;
text-align: center;
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句