Volle Höhe ansprechendes Logo so viel wie Header in Bootstrap

Ich habe diese Bootstrap-Thema-Header von Laravel Auth:Volle Höhe ansprechendes Logo so viel wie Header in Bootstrap

<body id="app-layout" style="background-color:#F5F5F5;"> 
     <nav class="navbar navbar-default navbar-static-top" style="background-color:white;"> 
      <div class="container"> 
       <div class="navbar-header"> 

        <!-- Collapsed Hamburger --> 
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#app-navbar-collapse"> 
         <span class="sr-only">Toggle Navigation</span> 
         <span class="icon-bar"></span> 
         <span class="icon-bar"></span> 
         <span class="icon-bar"></span> 
        </button> 


        <!-- Branding Image --> 
        <a class="navbar-brand" href="{{ url('/') }}"> 
        <p>NameOfBrand</p> 
        </a> 

       </div> 
       ... 
      </div> 
     </nav>

Ich mag mein Logo nach den 

<img class="navbar-brand" src="images/logoName.svg"></img>

Aber dem Ergebnis hinzufügen , ist das Logo so klein, dass es auch im Vektorformat erkannt werden kann.

Meine Frage, wie das Logo im Header, um die gleiche Höhe wie der Kopf ist, oder zumindest groß genug zu machen.

Quelle

2016-09-13 DomainFlag

Sie sollen Ihr Logo spezifische Höhe eingestellt:

.navbar-brand { 
    height: 50px; 
    width: 50px; 
}

oder Verwendung Prozentsatz: http://jsfiddle.net/QrrpB/2551/

Quelle

2016-09-13 17:08:47

Leichte Überprüfung, wenn ich so tun, und steigen die Werte der Header in Höhe steigt hoch auch mit dem Logo selbst. Und es gibt eine Art Margin-Bottom in der Header-Top, die das Logo höher werden kann. – DomainFlag

Aktualisierte Antwort mit einer Geige, überprüfen Sie es. –

Aber wie kann ich dieses Bild reagieren, was auch immer ich zoome oder nicht? – DomainFlag

Volle Höhe ansprechendes Logo so viel wie Header in Bootstrap

Antwort

Verwandte Themen