CSS/Properties/background-image

From Web Education Community Group
Jump to: navigation, search

background-image

The background-image property sets the background image of an element.

Description

Values <uri> | none | inherit
Initial value none
Applies to All elements
Inherited No


Point, Note

  • When setting a background image, authors should also specify a background color that will be used when the image is unavailable. [Example B]


Values

  • <uri>


  • none
    If specified, no background image is displayed. This is default.


  • inherit
    Takes the same specified value as the property for the element's parent.


Example

Example A

[style.css]

 body {
   background-image: url("images/bg.png");
 }

[index.html]

  <body>
    <p>This is a paragraph</p>
  </body>

Csslist2 background-image.png

Example B

[style.css]

 body {
   background-image: url("images/bg.png");
   background-color: #005a9c;
 }

[index.html]

  <body>
    <p>This is a paragraph</p>
  </body>

Csslist2 background-image.png


CSS Reference

The CSS specification defines the background-image property in 14.2.1 Background properties.