もっと"Try it Yourself"以下の例。
定義と使用法
backgroundPositionプロパティセットまたは要素内の背景画像の位置を返します。
ブラウザのサポート
表中の数字は完全にプロパティをサポートする最初のブラウザのバージョンを指定します。
| プロパティ | |||||
|---|---|---|---|---|---|
| backgroundPosition | 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
構文
backgroundPositionプロパティを返します：
object .style.backgroundPosition
backgroundPositionプロパティを設定します。
object .style.backgroundPosition= value プロパティ値
| 値 | 説明 |
|---|---|
| top left top center top right center left center center center right bottom left bottom center bottom right | あなたが唯一つのキーワードを指定する場合は、他の値になります"center" 。 |
| x% y% | xの値は、水平位置を示し、Y値は、垂直方向の位置を示しています。 左上隅には、0％、0％です。 右下の隅には、100％、100％です。 あなたは一つの値だけを指定した場合、他の値が50％になります。 |
| xpos ypos | xの値は、水平位置を示し、Y値は、垂直方向の位置を示しています。 左上隅は0 0単位はピクセルであり得るある(0px 0px)または任意の他のCSSユニット。 あなたは一つの値だけを指定した場合、他の値が50％になります。 あなたは％と単位を混在させることができます |
| initial | このプロパティがデフォルト値に設定します。 最初の記事を読みます |
| inherit | その親要素からこのプロパティを継承します。 継承についての記事を読みます |
技術的な詳細
| デフォルト値： | 0％0％ |
|---|---|
| 戻り値： | 背景画像の位置を表す文字列 |
| CSSのバージョン | CSS1 |
その他の例
例
背景画像の位置変更<div>中央底部に素子。
document.getElementById("myDiv").style.backgroundPosition = "center bottom"; »それを自分で試してみてください 例
背景画像の位置変更<div>横200pxのと40ピクセル垂直に要素を。
document.getElementById("myDiv").style.backgroundPosition = "200px 40px";
»それを自分で試してみてください 関連ページ
CSSチュートリアル： CSSの背景
CSSリファレンス： background-image property
CSSリファレンス： background-position property
HTML DOMリファレンス： background property
<スタイルオブジェクト