HTML and CSS Reference
In-Depth Information
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 “chapter9/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:
H ere ar e the proper ties yo u add ed
in the e xercis e on t he pre vious p age.
.guarantee {
line-height: 1.9em;
font-style: italic;
font-family: Georgia, "Times New Roman", Times, serif;
color: #444444;
border-color: black;
border-width: 1px;
border-style: solid;
background-color: #a7cece;
padding: 25px;
margin: 30px;
background-image: url(images/background.gif);
}
 
Search WWH ::




Custom Search