もっと"Try it Yourself"以下の例。
定義と使用法
backgroundRepeatプロパティセットまたは戻り繰り返す方法(tile)背景画像を表示します。
ブラウザのサポート
表中の数字は完全にプロパティをサポートする最初のブラウザのバージョンを指定します。
| プロパティ | |||||
|---|---|---|---|---|---|
| backgroundRepeat | 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
構文
backgroundRepeatプロパティを返します：
object .style.backgroundRepeat
backgroundRepeatプロパティを設定します。
object .style.backgroundRepeat="repeat|repeat-x|repeat-y|no-repeat|initial|inherit"
プロパティ値
| 値 | 説明 |
|---|---|
| repeat | 背景画像は、垂直方向と水平方向の両方に繰り返されます。 これがデフォルトです |
| repeat-x | 背景画像は、水平方向だけ繰り返されます |
| repeat-y | 背景画像は、垂直方向にのみ繰り返されます |
| no-repeat | 背景画像が繰り返されていません |
| initial | このプロパティがデフォルト値に設定します。 最初の記事を読みます |
| inherit | その親要素からこのプロパティを継承します。 継承についての記事を読みます |
技術的な詳細
| デフォルト値： | 繰り返す |
|---|---|
| 戻り値： | 背景画像が繰り返される方法を表す文字列 |
| CSSのバージョン | CSS1 |
その他の例
例
指定されたDIV要素のbackgroundRepeatプロパティを変更します。
document.getElementById("myDIV").style.backgroundRepeat = "repeat-x"; »それを自分で試してみてください 例
水平方向または垂直方向に繰り返すように背景画像を設定します。
function repeatVer()
{
document.body.style.backgroundRepeat = "repeat-y";
}
function repeatHor() {
document.body.style.backgroundRepeat = "repeat-x";
} »それを自分で試してみてください 関連ページ
CSSチュートリアル： CSSの背景
CSSリファレンス： background-position property
CSSリファレンス： background-repeat property
HTML DOMリファレンス： background property
<スタイルオブジェクト