Style backgroundImage property

Definition and Usage

backgroundImage Set or return the background image of an element.

Tip:In addition to the background image, you should also specify the background color. If the image is not available, the background color will be used.

See also:

HTML Styles:background property

CSS Tutorial:CSS-bakgrund

CSS3 Tutorial:CSS3 Backgrounds

CSS Reference Manual:background-image property

Instance

Example 1

Set the background image for the document:

document.body.style.backgroundImage = "url('img_tree.png')";

Try it yourself

Example 2

Set the background image of the specific <div> element:

document.getElementById("myDiv").style.backgroundImage = "url('img_tree.png')";

Try it yourself

Example 3

Return the background image of the specific <div> element:

alert(document.getElementById("myDiv").style.backgroundImage);

Try it yourself

Example 4

Return the background image of the document:

alert(document.body.style.backgroundImage);

Try it yourself

Syntax

Return the backgroundImage property:

object.style.backgroundImage

Set the backgroundImage property:

object.style.backgroundImage = "url('URL')|none|initial|inherit"

Property value

Value Description
url('URL) The location of the image file.
none No background image. Default.
initial Set this property to its default value. See initial.
inherit Inherit this property from its parent element. See inherit.

Technical details

Default value: none
Return value: A string representing the background image.
CSS version: CSS1

Browser support

backgroundImage It is a CSS1 (1996) feature.

All web browsers fully support it:

Chrome Edge Firefox Safari Opera IE
Chrome Edge Firefox Safari Opera IE
Stöd Stöd Stöd Stöd Stöd Stöd