CSS背景、プロパティの詳細（簡易メモ）

CSS背景、プロパティの詳細

background-size:cover;
 縦横比を保持して、表示領域全体を覆うように背景画像を表示する

background-size:contain;
 縦横比を保持して、表示領域に収まるように背景画像を表示する

background-size:値指定 auto;	
横幅は指定した値、縦幅は元の比率を保持して自動で表示する

background-size:auto 値指定;	
縦幅は指定した値、横幅は元の比率を保持して自動で表示する

表示領域全体を覆う 
background-size:cover; 
は縦横比を保持したまま表示領域全体を背景画像で覆うように拡大、縮小します。
画像で全体を埋めたい時に使えます。
①background:#ddd url(image.jpg) no-repeat center center;
②background-size:cover;

参考

https://gimmicklog.com/css3/747/