ホームページ作成の基礎からご提供するホームページ作成Space

color, image, repeat, attachment, position を一度に指定します。順序は自由で、省略も可能です。IE3.0 ではこの background: の形式のみがサポートされているようです。body の他、div や table などに対しても用いることができます。

BODY { background: url(image/back.gif) no-repeat fixed 50% 50%; }

背景色を指定します。テキスト部分のみの指定も可能です。color には色の名前、transparent（既定値：透明色）、inherit（継承）のいずれかを指定します。

H1 { background-color: #ccccff; }

背景画像の URL、または none（既定値：画像なし）、inherit（継承）のいずれかを指定します。span や b や td などにも適用できますが、Netscape 4.0 の場合は tr や table に適用することができないので注意してください。

BODY { background-image: url(http://www.yyy.zzz/image/back.gif); }

背景画像の並べかたを repeat（既定値：敷き詰める）、repeat-x（横方向のみ並べる）、repeat-y（縦方向のみ並べる）、no-repeat（ひとつだけ表示する）、inherit（継承）のいずれかで指定します。

BODY {
  background-image: url(image/back.gif);
  background-repeat: repeat-y;
}

ウィンドウのスクロールを動かした時の背景の動作を scroll（既定値：一緒にスクロールする）、fixed（スクロールしない）、inherit（継承）のいずれかで指定します。

BODY {
  background-image: url(image/back.gif);
  background-attachment: fixed;
}

背景の横方向の位置を left（左端）、center（中央）、right（右端）または 50% のような割合で指定し、縦方向の位置を top（上端）、center（中央）、bottom（下端）または 50% のような割合で指定します。fixed と共に指定することにより、背景画像の表示位置を指定することができます。下記の例では、背景画像を中央にひとつだけ表示します。

BODY {
  background-image: url(image/back.gif);
  background-repeat: no-repeat;
  background-position: center center;
  background-attachment: fixed;
}