MitoRoid

背景色を指定するには、background-colorプロパティを使用します。
色の値の指定は「 フォントの色」の指定と同じです。

ウインドウの表示領域すべてに色をつけたい場合は、body要素にbackbround-colorプロパティを指定します。

コンテンツを表示する領域の背景には、色や背景画像を指定することができます。

背景色を指定するには、background-imageプロパティを使用します。

背景画像の場所を示す値には、URL(パス)の形で指定します。
通常のリンクパスと同じように絶対パスと相対パスで指定ができます。

background-imageプロパティで指定した背景画像は、通常、指定したブロック要素の範囲内で、縦方向と横方向に繰り返し 敷き詰められます。

body要素に指定してページ全体の背景を指定したり、見出しなどの特定の要素の背景を指定することも できます。

background-imageプロパティで指定した背景画像の繰り返しパターンをしてする場合は、background-repeatプロパティを使用します。

値	説明
repeat	要素の背景一面に背景画像を敷き詰める(デフォルト)
repeat-x	横一列方向に背景画像を敷き詰める
repeat-y	縦一列方向に背景画像を敷き詰める
no-repeat	繰り返さない

背景画像の表示位置は、background-positionプロパティで指定します。

値として指定できるものは、単位つきの数値、%、キーワードです。

左右の表示に指定できる値

値	説明
right	背景画像の右寄せのキーワード
left	背景画像の左寄せのキーワード
center	背景画像の中央寄せのキーワード
%(割合)	表示範囲に大きさに対する割合で位置を表示
数値(px等)	表示範囲の左からの表示位置

上下の表示に指定できる値

値	説明
top	背景画像の上寄せのキーワード
bottom	背景画像の下寄せのキーワード
center	背景画像の中央寄せのキーワード
%(割合)	表示範囲に大きさに対する割合で位置を表示
数値(px等)	表示範囲の左からの表示位置

%と単位つきの数値を使って値を記述する場合、基準となる位置は背景画像を敷く要素の左上からの割合や数値となります。

キーワードと割合や数値を組み合わすことはできません。