2016-12-13 15 views
0

私は電話でそれを見ると、その画像を反応させようとしています。私が今使ってみると、それぞれの画像が画面の幅をすべて取っています...私はそれに反応する必要があります。ブートストラップに対応した画像

The images I am talking about : 、ここでは、コードは次のとおりです。助けを

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <title>Signature Helpers - En Marche</title> 
    </head> 
    <body style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space;"> 
      <div> 
      <a href="https://www.en-marche.fr/suivez-en-marche/?utm_source=SIGNATURE&utm_campaign=SIGNATURE&utm_medium=MAIL"> <img src="https://storage.googleapis.com/en-marche-fr/COMMUNICATION/SIGNATURE-E-MAIL/Signature_suivez_nous.png" height="28"/></a><span><a href="https://www.facebook.com/EnMarche"><img src="https://storage.googleapis.com/en-marche-fr/COMMUNICATION/SIGNATURE-E-MAIL/Signature_facebook.png" height="28"/></a><span><a href="https://www.instagram.com/enmarchefr/"><img src="https://storage.googleapis.com/en-marche-fr/COMMUNICATION/SIGNATURE-E-MAIL/Signature_insta.png" height="28"/></a><span><a href="https://twitter.com/enmarchefr"><img src="https://storage.googleapis.com/en-marche-fr/COMMUNICATION/SIGNATURE-E-MAIL/Signature_twitter.png" height="28"/></a><span> 
      <br> 
      <a href="https://storage.googleapis.com/en-marche-fr/Territoire/EN-MARCHE-KIT-DE-L-ENGAGE.pdf"> <img src="https://storage.googleapis.com/en-marche-fr/COMMUNICATION/SIGNATURE-E-MAIL/Signature_kit.png" height="28"/></a> 
      <a href="https://www.en-marche.fr/espaceperso/?utm_source=SIGNATURE&utm_campaign=SIGNATURE&utm_medium=MAIL"><img src="https://storage.googleapis.com/en-marche-fr/COMMUNICATION/SIGNATURE-E-MAIL/Signature_comite%CC%81s.png" height="28"/></a> 
      <br> 
      <a href="https://www.en-marche.fr/?utm_source=SIGNATURE&utm_campaign=SIGNATURE&utm_medium=MAIL"> <img src="https://storage.googleapis.com/en-marche-fr/COMMUNICATION/SIGNATURE-E-MAIL/Signature_site.png" height="28"/></a> 
     </div> 
    </body> 
</html> 

ありがとう! M.ドウで答えとして

<img class="img-responsive" src="images/example.png" alt=""> 

答えて

1

は次のように、応答性の属性値

img{ 
    max-width: 100%; 
    height: auto; // to maintain aspect ratio 
} 

これは、あなたのimgの最大幅が画面の幅またはブラウザの幅

0

は、ブートストラップのクラスimg-responsive

<img class="img-responsive" src="images/pic.png" alt=""> 

を使用するかは、CSSの下に使用することができます:あなたは、クラスに入れなければなりません

関連する問題