HTML and CSS Reference
In-Depth Information
To change the style of the
address
element:
◗
1.
Return to the
sa_styles.css
file in your text editor.
◗
2.
At the bottom of the style sheet, add the following style rule for the
address
ele-
ment nested within the
footer
element (see Figure 3-36):
/* Footer styles */
footer address {
background-color: rgb(55, 102, 55);
color: white;
color: rgba(255, 255, 255, 0.8);
font: normal small-caps 0.8em/4em 'Times New Roman', Times, serif;
text-align: center;
}
Figure 3-36
Designing the footer address
set the background color to
dark and the text color to white
or semi-transparent white
shortcut font
property
center the text horizontally
◗
3.
Save your changes to the file and then reload the
home.htm
file in your Web
browser. Scroll to the bottom of the page and verify that the style of the
address
element has been changed as shown in Figure 3-37.
Figure 3-37
Reformatted address text
address text
Tammy likes the way the fonts appear on her Web site. She especially likes the fact
that because these changes were made in a CSS style sheet, the styles automatically
apply to the other Web pages on the site, as well as any Web page she adds to the site in
the future.