2017-05-26 5 views
0

Die kleine Icon-Leiste (die Drei-Zeilen-Sache) wird nicht auf meiner Website angezeigt, aber es ist vielleicht nicht meinem Dreamweaver ähnlich? HelpppppppppButton Icon Bar wird nicht auf der Webseite angezeigt - bootstrap

<header role="banner"> 
<nav id="navbar-primary" class="navbar" role="navigation"> 
<div class="container-fluid"> 
<!-- Brand and toggle get grouped for better mobile display --> 
<div class="navbar-header"> 
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-primary-collapse"><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button> 
    <span class="sr-only">Toggle navigation</span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    </button> 
</div> 
<div class="collapse navbar-collapse" id="navbar-primary-collapse"> 
    <ul class="nav navbar-nav"> 
    <li class="active"><a href="#">Link</a></li> 
    <li><a href="#">Link</a></li> 
    <li><a href="#">Link</a></li> 
    <li><a href="#"><img id="logo-navbar-middle" src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/32877/logo-thing.png" width="200" alt="Logo Thing main logo"></a></li> 
    <li></li> 
    <li><a href="#">Link</a><a href="#">Link</a></li> 
    <li><a href="#">Link</a></li> 
    </ul> 
</div><!-- /.navbar-collapse --> 
</div><!-- /.container-fluid --> 
</nav> 
</header><!-- header role="banner" --> 
</body> 

</html> 

Antwort

0

Sie vermissen die navbar-default Klasse in <nav class="navbar">.

HTML:

<nav class="navbar navbar-default"> 
     <div class="container"> 
     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> 
      <span class="sr-only">Toggle navigation</span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      </button> 
      <a class="navbar-brand" href="#">Project name</a> 
     </div> 
     <div id="navbar" class="collapse navbar-collapse"> 
      <ul class="nav navbar-nav"> 
      <li class="active"><a href="#">Home</a></li> 
      <li><a href="#about">About</a></li> 
      <li><a href="#contact">Contact</a></li> 
      </ul> 
     </div><!--/.nav-collapse --> 
     </div> 
    </nav> 
Verwandte Themen