2016-08-25 121 views
-1

這是與其他問題不同的問題。因爲在這個問題邊欄包裝到標誌。 我想在我的頁面中使用徽標。但是當我使用它。它不適合在屏幕上。側欄覆蓋桌面上的徽標。屏幕截圖也附加this is the result on desktop。 只顯示一半標誌。 但是當我在我的手機中打開此頁面。看上去不錯。帶導航標誌的Bootstrap

<nav class="navbar navbar-default navbar-static-top" role="navigation" style="margin-bottom: 0"> 
     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
       <span class="sr-only">Toggle navigation</span> 
       <span class="icon-bar"></span> 
      </button> 
      <a href="index.php" class="navbar-left"><img src="logo.jpg" alt=""></a> 
     </div> 
     <!-- /.navbar-header --> 

     <ul class="nav navbar-top-links navbar-right"> 

      <!-- /.dropdown --> 

      <li class="dropdown"> 
       <a class="dropdown-toggle" data-toggle="dropdown" href="#"> 
        <i class="fa fa-user fa-fw"></i> <i class="fa fa-caret-down"></i> 
       </a> 
       <ul class="dropdown-menu dropdown-user"> 
        <li><a href="add_user.php"><i class="fa fa-user fa-fw"></i> Add User</a> 
        </li> 

       </ul> 
       <!-- /.dropdown-user --> 
      </li> 
      <!-- /.dropdown --> 
     </ul> 
     <!-- /.navbar-top-links --> 

     <div class="navbar-default sidebar" role="navigation"> 
      <div class="sidebar-nav navbar-collapse"> 
       <ul class="nav" id="side-menu"> 

        <li> 
         <a href="index.php"><i class="fa fa-dashboard fa-fw"></i> Dashboard</a> 
        </li> 

       </ul> 
      </div> 
      <!-- /.sidebar-collapse --> 
     </div> 
     <!-- /.navbar-static-side --> 
    </nav> 

請幫我如何適應此圖片?感謝

+0

指定img標籤的高度和寬度屬性,然後嘗試。 – Rahi

+0

無法正常工作。 #Rahi –

回答

1

嘗試

在標記

<img class="img-responsive logo" src="logo.jpg" alt=""> 

並在CSS

.logo {max-width:150px; /* Adjust accordingly */ } 

和填充/保​​證金添加到側邊欄。

+0

真的很有幫助。謝謝 –