[英]Image not resizing Bootstrap 3
我目前正在使用Bootstrap 3框架來創建原型,我的網站標題中有一個徽標圖像,似乎根本沒有調整大小。 我給了它圖像響應類,但是它不影響它。
我認為該列可能未包含圖像內容。 我創建了一個小提琴(帶有來自Google的示例標題圖片)
http://jsfiddle.net/pocockn/52VtD/10157/
<!-- navbar and logo -->
<div class="navbar navbar-default" role="navigation">
<div class = "row nav-row">
<div class="col-md-10">
<div class="navbar-header">
<a class="navbar-brand" href="#"><img src ="http://slant.investorplace.com/files/2013/08/pandora-stock-logo.png" class="img-responsive"></a>
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".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>
</div>
</div> <!-- end of col md 8 -->
<div class="col-md-2">
<div class="navbar-collapse collapse">
<ul class="nav nav-stacked">
<li><a href="home.html">ROOMS</a></li>
<li><a href="about.html">PROFILE</a></li>
<li><a href="artists.html">CONTACT</a></li>
</ul>
</div> <!-- end of col md 4 -->
</div><!-- end of row -->
</div><!-- end of container -->
謝謝!
一種方法是使用css直接覆蓋img
:
小提琴 : http : //jsfiddle.net/62uz5odq/
.navbar-brand > img {
width:auto;
height:100%;
}
演示嘗試這個我在img標簽中添加了類“徽標”,在標簽中添加了“ remove_pad”類
.logo{
width:100%;
height:100%;
}
.remove_pad{
padding:0px !importnat;
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.