Question

当我缩小窗口时，我仍然可以点击汉堡包图标所在的位置，下拉滴眼液就可以了，但是汉堡包没有图标（也就是3条小线条）任何帮助都会很棒！

 <nav class="navbar navbar-fixed-top">
      <div class="container">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="/">GroupWrites</a>
        </div>

         <!--Collect the nav links, forms, and other content for toggling -->
        <div class="navbar-collapse collapse"  id="bs-example-navbar-collapse-1">
          <ul class="nav navbar-nav">
            <li><a href="/browse">Explore</a></li>
            <li><a href="/browse/new">Publish</a></li> 
            <li><a href="/library">Library</a></li>
            <li><a href="/about">How It Works</a></li>
          </ul>
          <ul class="nav navbar-nav navbar-right">
            <% if(!currentUser){ %>
            <li><a href="/register">Create Account <i class="fa fa-user-plus"></i></a></li>
            <li><a href="/login">Log In <i class="fa fa-user-circle"></i></a></li>
            <% } else { %>
            <li><a href="#">Signed In As <%= currentUser.username %></a></li>
            <li><a href="/logout">Log Out <i></i></a></li>
            <% } %>
            </ul>
        </div>
      </div>
    </nav>

CSS

body { font-family: comfortaa; padding-top: 90px; line-height: 1.75 }
.navbar{ background-color: #3c3d41; color: white; padding: 5px; }
.navbar li a:hover, 
.navbar li a:active { border-bottom: 2px solid white; background-color: #3c3d41; color: white ; }
.navbar-brand:hover,
.navbar-brand:active { border-bottom: 2px solid white; background-color: #3c3d41; color: white ; }
a { color: white; }
#button { background: rgb(100,149,237); color: white; }

这是我的导航条代码。它在我的标题中，一切都很完美，我实际上看不到汉堡包图标本身。任何帮助都会很棒。谢谢，麻烦您了。看起来很容易让我无法理解。

Answer 1

所以我得到了它的工作，通过将类从“navbar navbar-fixed-top”更改为“navbar-inverse navbar-fixed-top”仍然不确定为什么会这样。使用navbar-inverse我的汉堡包图标栏显示。所以我只是根据我想要的颜色和css自定义.navbar-inverse。

无法看到NAVBAR汉堡ICON，但它的确有效

1 个答案: