Adding a background image

You’re almost there. What’s left? We still need to get the white “guarantee star” graphic into the paragraph and work on the border, which is a solid, black line. Let’s tackle the image first.

If you look in the “chapter10/lounge/images” folder, you’ll find a GIF image called “background.gif” that looks like this:

Now, you just need to get that image into your paragraph element, so you’ll be using an <img> element, right? Not so fast. If you’re adding an image to the background of an element, there is another way. Using CSS, you can add a background image to any element using the background-image property. Let’s give it a try and see how it works:

No, the background-image property has a very specific purpose, which is to set the background image of an element. It isn’t for placing images in a page – for that you definitely want to use the <img> element.