将导航栏中的菜单选项对齐到中心

时间:2015-01-30 16:52:52

标签: css twitter-bootstrap

以完整页面模式打开以下引导程序主题:

http://plnkr.co/edit/0MV3QzRpJcPWlpuNMDav?p=preview

导航栏上的

您将看到六个选项: 三个是字体真棒图标,另外三个是文本“关于,下载和联系”。

我想要实现的是将font-aweome图标放在导航栏的中心而不是右侧。

我尝试了各种各样的选项,比如把它们放在等等......但是所有这些都会导致某些事情或其他因素破裂。

           <ul class="nav navbar-nav nav-advance-options">
                <!-- Hidden li included to remove active class from about link when scrolled up past about section -->
                  <li>
                    <a class="page-scroll" href="#flax"><i class="fa fa-leaf"></i></a>
                </li>
                <li>
                    <a class="page-scroll" href="#moist"><i class="fa fa-heart"></i></a>
                </li>
                <li>
                    <a class="page-scroll" href="#designs"><i class="fa fa-paw"></i></a>
                </li>
            </ul>



            <ul class="nav navbar-nav nav-basic-options">
                <!-- Hidden li included to remove active class from about link when scrolled up past about section -->
                <li class="hidden">
                    <a href="#page-top"></a>
                </li>
                <li>
                    <a class="page-scroll" href="#about">About</a>
                </li>
                <li>
                    <a class="page-scroll" href="#download">Download</a>
                </li>
                <li>
                    <a class="page-scroll" href="#contact">Contact</a>
                </li>
            </ul>



        </div>

0 个答案:

没有答案