新着! 44ページの電子書籍「CSS in 44 minutes」がリリースされました! 😃
#background-size
背景画像のサイズを定義します。
デフォルト
background-size: auto auto;
背景画像は元のサイズを保持します。
たとえば、この背景画像は960px x 640pxの大きさです。アスペクト比は3:2です。コンテナ(高さ150px)よりも大きいため、クリップされます。
background-size: 120px 80px;
サイズはピクセル単位で指定できます
- 最初の値は横のサイズです
- 2番目の値は縦のサイズです
background-size: 100% 50%;
パーセント値も使用できます。ただし、これは背景画像のアスペクト比を変更し、予期しない結果になる可能性があることに注意してください。
background-size: contain;
キーワード`contain`は、背景画像が完全に表示されるようにサイズを変更します。
background-size: cover;
キーワード`cover`は、要素が完全に覆われるように背景画像のサイズを変更します。