包裹时如何在引导程序 3 中将导航列表居中答案

【问题标题】：How can I center a nav list in bootstrap 3 when it wraps包裹时如何在引导程序 3 中将导航列表居中
【发布时间】：2013-12-18 08:50:08
【问题描述】：

我无法发布图片，但我在网站即时编码上有一个导航菜单。我试图粉碎移动网站，但是当我这样做时，li 菜单会下降。但是我希望它居中。

这是我目前的代码

@media (min-width:768px){


}


<ul class="nav nav-tabs nav-menu img-centered">
     <li class="nav-link-green"><a href="#">Home</a></li>
     <li class="nav-link-yellow"><a href="#">About Us</a></li>
     <li class="nav-link-red"><a href="#">Parents & Carers</a></li>
     <li class="nav-link-blue"><a href="youngpeople.aspx">Young People</a></li>
     <li class="nav-link-purple"><a href="#">News & Updates</a></li>
     <li class="nav-link-green"><a href="#">Contact Us</a></li>
     <li class="nav-link-blue dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" role="button" href="#">Publications <span class="caret"></span></a>
                <ul class="dropdown-menu" role="menu">
                    <li><a href="#">Safeguarding Library</a></li>
                    <li class="nav-divider"></li>
                    <li><a href="#">Learning Zone</a></li>
                    <li class="nav-divider"></li>
                    <li><a href="#">TSCB Publications</a></li>
                </ul>
            </li>
        </ul>

我希望这是有道理的。如果您需要更多信息，请告诉我。这是我的第一篇文章

【问题讨论】：

标签： html css twitter-bootstrap centering

【解决方案1】：

您是否在导航上尝试过 .collapse 类？喜欢这里：http://getbootstrap.com/components/#navbar

【讨论】：

我刚刚在这一行中插入了“collapse”

【解决方案2】：

好的，解决了。刚刚将此代码添加到 css 中。

ul {
  display: block;
  text-align: center;
}

li {
  display: inline-block;
  position: relative;
  text-align: center;
  float: none;
}

这使它成为现实。

【讨论】：