2017-09-15 6 views
0

3つの画像の幅と高さのサイズを変更する必要があります。 jQueryでやりたいjquery関数でサイズを変更する画像

これを行うにはCSSをいくつか適用しましたが、クラスcol-md-6の画像が右側に移動するため、CSSが失敗します。この画像を右に動かす代わりに固定したい。ここで

は私のコードです:

#img1:hover { 
 
    width: 200px; 
 
    height: 200px; 
 
} 
 

 
#img2:hover { 
 
    width: 200px; 
 
    height: 200px; 
 
} 
 

 
#img3:hover { 
 
    width: 200px; 
 
    height: 200px; 
 
} 
 

 
.col-centered { 
 
    float: none; 
 
    margin: 0 auto; 
 
}
<div class="row"> 
 
    <div class="col-md-6" id="mision"> 
 
     <img src="imagenes/MISION.png" id="img1" class="resize"> 
 
    </div> 
 
    <div class="col-md-6" id="vision"> 
 
     <img src="imagenes/VISION.png" id="img2" class="resize"> 
 
    </div> 
 
    <div class="col-md-6 col-centered" id="servicios"> 
 
     <img src="imagenes/SERVICIOS.png" id="img3" class="resize"> 
 
    </div> 
 
</div

+0

あなたが望むものは本当に不明です。ホバー状態についてのみ、あなたのイメージのサイズを定義したことはありませんが、ホバリングについては何も書いていません... – Johannes

答えて

0

は前にブートストラップ使用していないが、迅速なgooglelingは

.table-img { 
    width: 100px; 
} 

.table-img:hover { 
    width: 200px; 
} 

<div class="row"> 
    <div class="col-md-6 text-center" id="mision"> 
    <img src="imagenes/MISION.png" class="resize"> 
    </div> 
    <div class="col-md-6 text-center" id="vision"> 
    <img src="imagenes/VISION.png" class="resize"> 
    </div> 
    <div class="col-md-6 text-center col-centered" id="servicios"> 
    <img src="imagenes/SERVICIOS.png" class="resize"> 
    </div> 
</div> 
を示唆します3210

テキストセンターはイメージをセンタリングするためのもので、調整されたCSSはイメージのホバリングとサイズの拡大に有効です。

質問が正しく理解できなかった場合は、教えてください。

関連する問題