background-repeatプロパティ

background-repeatプロパティの概要
機能	背景画像の配置方法を定義
指定可能な値	repeat, repeat-x, repeat-y, no-repeat
初期値	no-repeat
継承	しない
適用可能なボックス	全て

background-repeatプロパティは、要素の背景画像の配置方法を定義します。background、あるいは、background-imageプロパティが定義されている要素でなければ、このプロパティを使用しても意味はありません。指定できる値には、次のようなものがあります。

no-repeat

画像をタイル状に配置したくない場合には、no-repeatを指定します。no-repeatを指定すると、要素の左上に画像が1度だけ表示されます。

入力例に使用した画像


body {
    background-image: url(back.gif);
    background-repeat: no-repeat;
}

repeat-xを指定すると、要素の左上から横方向（x軸方向）のみに画像が繰り返して表示されます。


body {
    background-image: url(back.gif);
    background-repeat: repeat-x;
}

repeat-yを指定すると、要素の左上から縦方向（y軸方向）のみに画像が繰り返して表示されます。


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

repeatを指定すると、何も指定していないときと同様に画像がタイル状に繰り返して表示されます。既に、no-repeat等で繰り返し表示をさせないように設定していて、デフォルトであるタイル状に配置させたい場合に使用します。


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