Html Navbar mit mobilen Unterstützung und Logo

Question

Ich möchte eine Navbar auf meiner Website, kann aber nicht herausfinden, ich will es so etwas aussehen wie Aber ich möchte ein Logo darauf haben, so dass das Problem ist, das ich habe. Es sollte so etwas wie das untere auf diesem site

Answer 1

Gehen Sie zu https://getbootstrap.com/getting-started/, und Sie können lernen, Bootstrap zu verwenden, um Dinge wie Navbars leicht zu erstellen.

Setzen Sie dies oben im HTML-Skript im Kopfbereich, damit der Bootstrap funktioniert oder laden Sie den Bootstrap herunter und legen Sie ihn in Ihrem Projektordner ab.

<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 

Hier ist ein Beispiel mit Bootstrap.

 <!--appear when room to display is smaller--> 

     <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#top"> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
     </button> 
     <a class="navbar-brand" href="#">Your Logo</a> 
     </div> 


     <div class="collapse navbar-collapse" id="top"> 
     <ul class="nav navbar-nav"> 
      <li class="active"> 
      <a href ="put your link here"> 
       Item 
      </a> 
      </li> 

    <!--align content to the right--> 
     <ul class="nav navbar-nav navbar-right"> 
     <li class="active"> 
      <a href =""> 
      <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>&nbsp; 
      Item 
      </a> 
     </li> 
     <li class="active"> 
      <a href =""> 
      <span class="glyphicon glyphicon-off" aria-hidden="true"></span>&nbsp; 
      Item 
      </a> 
     </li> 
     </ul> 
     </div> 
    </div> 
    </nav>