Question

我想在bootstrap导航栏上显示主页图标。我关注此链接http://www.tutorialrepublic.com/codelab.php?topic=bootstrap&file=pills-nav-with-icons

我的HTML看起来像

  <nav class="navbar navbar-inverse">
                    <div class="container-fluid">
                        <div class="navbar-header">
                            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
                                <span class="icon-bar"></span>
                                <span class="icon-bar"></span>
                                <span class="icon-bar"></span>
                            </button>
                        </div>
                        <div class="collapse navbar-collapse" id="myNavbar">
                            <ul class="nav navbar-nav">

                                <li class="active">
                                    <a href="#">
                                        <span class="glyphicon glyphicon-home"></span>
                                    </a>
                                </li>
<li><a href="#">Home</a></li>
<li><a href="#">All Parts</a></li>                                

                            </ul>
                        </div>
                    </div>
                </nav>

但仍然没有运气。我的主页图标看起来不太好。 jsfiddle是https://jsfiddle.net/0gjw5rzg/1/

Answer 1

如果你想要的只是Home和Icon在同一个导航项中，请在span标签后添加“Home”。

<li class="active">
  <a href="#">
    <span class="glyphicon glyphicon-home"></span> Home
  </a>
</li>

更新了小提琴：https://jsfiddle.net/0gjw5rzg/5/

带有主页图标问题的Bootstrap导航栏

1 个答案: