如何让导航栏在 this page 上居中? ,同时仍然保持背景渐变? I've seen some tricks其中 li
设置为显示 inline
,a
设置为显示 inline-block
, ul
将文本居中对齐,但是这些要求我将 float:none
添加到代码中,这会破坏我的背景渐变。有人可以解释一下吗?
最佳答案
在标记中添加两个类(带有可选名称,只是为了覆盖 CSS)。我们称它为 .nav-container
和 .menu-nav
。
<div class="navbar-inner">
<div class="container nav-container">
<ul class="nav menu-nav">
<li><a href="#services">Services</a></li>
<li><a href="#portfolio">Portfolio</a></li>
<li><a href="#contact">Contact</a></li>
<li><a href="#about">About</a></li>
</ul>
</div>
</div>
然后在CSS中添加
.nav-container {
text-align: center;
}
.menu-nav {
float: none;
}
我已经在我的 Chrome 检查器中更改了它,背景渐变看起来和以前一样。
关于css - 在保留样式的同时居中 Bootstrap 导航栏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15822953/