背景のスタイル

背景のスタイルを紹介します。

background-colorプロパティ

背景色を指定します。色はカラーネーム、カラーコード(16進数)、カラーコード(10進数)で指定します。

background-imageプロパティ

背景画像を指定します。構文は、「url(画像のパス)」となります。

background-repeatプロパティ

背景画像の繰り返し方法を指定します。

repeat(デフォルト)
上下・左右に繰り返します。
repeat-x
左右にのみ繰り返します。
repeat-y
上下にのみ繰り返します。
no-repeat
繰り返さず1つのみ表示します。

background-positionプロパティ

背景画像の位置を指定します。構文は、「横方向 縦方向」となります。
位置は、ピクセル(px)やパーセント(%)の数値、またはleft/center/right(横方向)、top/center/bottom(縦方向)で指定します。

background-attachmentプロパティ

背景画像のスクロール方法を指定します。

scroll(デフォルト)
ページのスクロールにあわせてスクロールします。
fixed
ページをスクロールしても、背景画像は固定されたままとなります。