スタイルbackgroundOrigin属性
- 前のページ backgroundClip
- 次のページ backgroundSize
- 上層に戻る HTML DOM Styleオブジェクト
定義と使用方法
backgroundOrigin 属性はbackground-position属性がどの位置に対して位置決定するかを定義します。
注釈：背景画像のbackground-attachment属性が "fixed"、この属性は効果がありません。
例
背景画像をコンテンツボックスに対して位置決定します：
document.getElementById("myDIV").style.backgroundOrigin = "content-box";
構文
backgroundOrigin属性の返り値：
object.style.backgroundOrigin
backgroundOrigin属性の設定：
object.style.backgroundOrigin = "padding-box|border-box|content-box|initial|inherit"
属性値
| 値 | 説明 |
|---|---|
| padding-box | デフォルト値。背景画像はパディングボックスに対して位置決定されます。 |
| border-box | 背景画像はボーダーボックスに対して位置決定されます。 |
| content-box | 背景画像はコンテンツボックスに対して位置決定されます。 |
| initial | この属性をデフォルト値に設定します。参照してください initial。 |
| inherit | 親要素からこの属性を継承します。参照してください inherit。 |
技術的詳細
| デフォルト値： | padding-box |
|---|---|
| 返り値： | 文字列で、要素の background-origin 属性。 |
| CSSバージョン： | CSS3 |
ブラウザのサポート
backgroundOrigin CSS3（1999）の機能です。
すべてのブラウザが完全にサポートしています：
| クローム | エッジ | ファイアフォックス | サファリ | オペラ | IE |
|---|---|---|---|---|---|
| クローム | エッジ | ファイアフォックス | サファリ | オペラ | IE |
| サポート | サポート | サポート | サポート | サポート | 11 |
関連ページ
CSS 参考マニュアル：background-origin 属性
- 前のページ backgroundClip
- 次のページ backgroundSize
- 上層に戻る HTML DOM Styleオブジェクト
