【CSS入門】backgroundプロパティで背景を設定する

CSSのbackgroundプロパティを使用することで、背景画像や背景色をつけることができます。

backgroundプロパティの使い方

このプロパティは、背景色、背景画像、背景の繰り返し、背景の位置、背景のサイズなど、複数の背景関連の設定を一つの宣言でまとめて指定できる強力なプロパティです。
例えば、background: #ffffff url(‘image.jpg’) no-repeat center center / cover;と設定すると、背景色が白(#ffffff)に設定され、背景画像（image.jpg）が繰り返しなし(no-repeat)で要素の中央(center)に配置され、背景画像のサイズが要素全体をカバー(cover)するように調整されます。
背景色は、色の名前、HEXコード、RGB、RGBAなどで指定可能です。背景画像はURLで指定し、複数の画像をカンマで区切って設定することもできます。背景の繰り返しは、repeat, no-repeat, repeat-x, repeat-yのように指定し、背景の位置はleft, right, top, bottom, centerや具体的なピクセル値、パーセンテージで指定できます。
背景のサイズは、cover, contain, または具体的な寸法で設定可能です。backgroundプロパティを効果的に活用することで、要素のビジュアルデザインを大幅に向上させ、魅力的で視覚的に一貫したWebページを作成することができます。