2016-09-13 5 views
0

에서 헤더로 나는 laravel의 인증에서이 부트 스트랩 테마 헤더가 : 나는 <!-- Branding Image -->전체 높이 반응 로고만큼 부트 스트랩

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

그러나 결과 후에 나의 로고를 추가 할

<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> 

을 로고가 너무 작아 벡터 형식 인 경우에도 인식 할 수 있습니다. 헤더, 또는 적어도 충분히 큰 만들기로 헤더 내에서 로고를 만드는 방법

enter image description here

내 질문은 같은 높이가 될 수 있습니다.

답변

1

당신은 당신의 로고의 특정 높이를 설정해야합니다 : 나는 그렇게 할 경우, http://jsfiddle.net/QrrpB/2551/

+0

약간 검증 및 헤더 로고 자체도 높이까지 상승 값을 상승 :

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

또는 사용 비율을. 로고가 더 높아질 수있는 헤더 상단에는 마진이 있습니다. – DomainFlag

+0

바이올린으로 답변을 업데이트했습니다. 확인해보십시오. –

+0

하지만이 이미지를 확대 또는 축소하여 반응하도록 만들 수있는 방법은 무엇입니까? – DomainFlag