Click here to navigate the course.

Drag the edges to resize the window.

In Projects, you can keep track of your progress as you go throught the tasks. Check each item as you complete it!

Web Browser

Code Editor
Reset Exercise
Learn
A Closer Look at CSS

A Background Image

In CSS, the background-image property sets a background image of your choice for a given selector, as seen below. 

.hero {
  background-image: url("https://s3.amazonaws.com/codecademy-content/projects/make-a-website/lesson-2/bg.jpg");
}

The CSS rule above assigns the image hosted at 

https://s3.amazonaws.com/codecademy-content/projects/make-a-website/lesson-2/bg.jpg

to elements that have a class attribute set to hero.

To control the size of the chosen background image, use the property background-size as seen below: 

.hero {
  background-image: url("https://s3.amazonaws.com/codecademy-content/projects/make-a-website/lesson-2/bg.jpg");
  background-size: cover;
}

Here, we have specified that we want the image to completely cover elements with the .hero class.

Community Forums
Get help and ask questions in the Codecademy Forums
Report a Bug
If you see a bug or any other issue with this page, please report it here.