CSSのIMGの画像は、親コンテナのdiv、適応コンテナのサイズを記入します

画像サイズが矛盾に遭遇するとき、複数の写真を紹介ページには、同じサイズの単一のディスプレイを必要とするとき、私たちは直接、画像サイズは、画像の歪みの原因となります設定し、これは我々が遭遇した問題で、次の解決方法をご覧ください

<div> 
        <IMG SRC = "導入絵アドレス" ALT = ""> 
</ div>

方法：最小値フィットの要素とその高さと幅のIMG垂直中心

 

DIV { 
    位置：相対。
　 幅：100ピクセル; 
    高さ：100pxに。
    オーバーフロー：隠されました; 
} 
 DIV IMG { 
    位置：絶対。
    トップ：50％; 
    左：50％; 
    表示ブロック; 
    最小幅：100％。
    最小高さ：100％。
    変換：変換（-50％、 - 50％）。
}

　　

方法2：設定するCSSのimgスタイル増加オブジェクトフィット：カバー似たCSS3の背景画像の背景サイズ：カバー;

DIV { 
　　幅：100pxに。
　　高さ：100pxに。

} 
DIV IMG { 
    幅：100％。
    高さ：100％; 
    オブジェクトフィット：カバー; 
}