09/02/2026
coverは“埋める”、containは“見せ切る”。
切れる/余るは“失敗”ではなく仕様です。
目的を先に決め、
「全面を埋めたい」
→ background-size: cover; + 中心に重要要素を置く安全領域設計
「全部見せたい」
→ contain+背景色で余白を馴染ませる
—保存用メモ—
埋めたい=background-size: cover;(中央安全)
見せ切り=contain+background-color
保存してチームに共有。実例URLがあればコメントで。
#背景画像 #フロントエンド