適応可能な画像サイズを実現する方法

画像サイズの適応

ブートストラップを介して画像適応を簡単に実装できます:

<img src="..." class="img-responsive" alt="Pic">

ブートストラップを参照する予定がない場合は、純粋な CSS を介して、ブートストラップで img 応答クラスの定義を表示できます:

.img-responsive {    
    display: inline-block;    
    height: auto;    
    max-width: 100%;}

このようにして、純粋な CSS を使用した画像の調整が完了しました。
コードを説明します。display により、画像を制限された形式で表示でき、幅と高さを設定できます。
次に、max-width を使用して設定します。幅 (他のクラスのペアをカバーできる) タグの幅属性の設定により、画像の適応性が高まり、逆に設定することもできますが、一般的にはこれがより頻繁に起こります。

以上が適応可能な画像サイズを実現する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。