Bugl — code interview practice that feels like a game

Loading lesson path

Flash cards

Review the key moves

1/4

Core idea

What is the main idea behind CSS Background Image?

Lesson checks

Short Mimo-style checks built from this lesson's code, terms, and sequence.

1Quick choice

Which statement best captures the main point of this lesson?

2Fill blank

Complete the missing token from the example code.

___-image: url("paper.gif");

3Order

Put the learning moves in the order that makes the concept easiest to apply.

The background-image property specifies an image to use as the background of an element.

The CSS Background Image Property

CSS background-image

The background-image property specifies an image to use as the background of an element.

By default, the image is repeated so it covers the entire element.

Example

Formatted code

body {
  background-image: url("paper.gif");
}

Live preview

Example

Formatted code

body {
  background-image: url("bgdesert.jpg");
}

Live preview

Note

When using a background image, use an image that does not disturb the text.

The background image can also be set for specific elements, like the <p> element:

Example

Formatted code

p {
  background-image: url("paper.gif");
}

Live preview

Property	Description
background-image	Sets the background image for an element