From the course: CSS: Enhancing Website Graphics

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Combine multiple backgrounds

Combine multiple backgrounds - CSS Tutorial

From the course: CSS: Enhancing Website Graphics

Start my 1-month free trial

Combine multiple backgrounds

- [Instructor] In previous videos, I've worked with only one background at a time. In this video, you'll learn how to create a web page that combines multiple background layers. Background layers are defined by placing the background definitions in a comma separated list. Styles for the top layer, or the one closest to the user's eye, are listed first. Styles for the second layer follow, and then the third layer, and so forth, concluding with the bottom layer, defined last in the list of background styles. Let's create multiple backgrounds for this page containing the text of a Longfellow poem. While the contrast between the white text and the black background makes the text easy to read, it lacks visual interest. Let's replace this current background with a vision of a night sky built by combining multiple backgrounds. I'll start by adding stars to my night sky using the image file stars.png. Since the stars are placed on top of the black background, I insert the stars.png file first…

Contents