Web Development and Design Foundations with XHTML, 5th Edition

(^88) Chapter 3 Configuring Color and Text with CSS
will attempt to use the fonts in the order listed. When processing a CSS rule such as
font-family: Arial, Verdana, sans-serif, the browser will use Arial if it is
installed. If Arial is not installed, the browser will use Verdana if it is installed. If nei-
ther Arial nor Verdana are installed, the browser will use any sans-serif font installed on
the computer. Finally, if no sans-serif fonts are installed on the computer, the default
font face will be used.
Now that you are familiar with font configuration using CSS, we’ll quickly explore
three other CSS properties that modify the appearance of text: text-align,
text-decoration, and line-height.
As you already know, the default alignment of text on a Web page is at the left margin,
called left alignment. The text-alignpropertyis used to specify the alignment of text.
Values for the text-alignproperty are left(default), right, and center.
Have you ever seen a hyperlink on a Web page that was not underlined? This is typi-
cally configured with thetext-decorationproperty (text-decoration: none).
See Table 3.1 for additional values that are less commonly used with the text-
decorationproperty.
Theline-heightpropertymodifies the default height of a line of text. For example,
code line-height: 200%to configure text to appear double-spaced.
HANDS-ON PRACTICE 3.3
Now that you’ve got a collection of new CSS properties for font and text configuration,
let’s try them out and modify the embedded.html page. Launch Notepad and open
embedded.html. You’ll code additional CSS style rules to configure the text on the page.
When complete, your Web page will look similar to the one shown in Figure 3.9.
Figure 3.9
CSS configures the
text on the Web
page