Style backgroundOriginProperty
Style ObjectExample
Position the background image relative to the content box:
document.getElementById("myDIV").style.backgroundOrigin="content-box";
Try it Yourself »
Definition and Usage
The backgroundOrigin property sets or returns what the background-position property is positioned relative to.
Note:If the background-image's background-attachment property is "fixed", this property has no effect.
Browser Support
IE9+, Firefox, Opera, Chrome and Safari support the background-origin property.
Syntax
Return the backgroundOrigin property:
object.style.backgroundOrigin
Set the backgroundOrigin property:
object.style.backgroundOrigin="padding-box|border-box|content-box|initial|inherit"
Property Values
| Value | Description |
|---|---|
| padding-box | Default value. The background image is positioned relative to the padding box. |
| border-box | The background image is positioned relative to the border box. |
| content-box | The background image is positioned relative to the content box. |
| initial | Sets this property to its default value. Seeinitial。 |
| inherit | Inherits this property from its parent element. Seeinherit。 |
Technical Details
| Default value: | padding-box |
|---|---|
| Return value: | A string, representing an element's background-origin property. |
| CSS Version | CSS3 |
Related Articles
CSS Reference Manual:background-origin property
Other Extensions