• Choose a category
• All
• Classic-Fiction

♦ Define an overall size for the page. If you want to define a font size for the entire page, do so in the tag. Use a named size, percentage, or ems to avoid the side effects of absolute sizing. The size defined in the body is applied to every element in the body automatically.

♦ Modify any other elements. You might want your links a little larger than ordinary text, for example. You can do this by applying a font-size attribute to an element. Use relative measurement if possible.

Determining Other Font Characteristics

In addition to size and color (see Chapter 1 of this minibook), you can change fonts in a number of other ways.

Figure 2-7 shows a number of common text modifications you can make.

Figure 2-7: Here are a few of the things you can do to modify text.

The various paragraphs in this page are modified in different ways. You can change the alignment of the text as well as add italic, bold, underline, or strikethrough to the text.

CSS uses a potentially confusing set of rules for the various font manipulation tools. One rule determines the font style, and another determines boldness.

I describe these techniques in the following sections for clarity.

I used a trick I haven’t shown yet to produce this comparison page. I have multiple paragraphs, each with their own style. Look to Chapter 3 of this minibook to see how to have more than one paragraph style in a particular page.

Using font-style for italics

The font-style attribute allows you to make italic text, as shown in Figure 2-8.

Figure 2-8: You can make italic text with the font-style attribute.

Here’s some code illustrating how to add italic formatting:

“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>

Italics

This paragraph is in italic form.

The font-style values can be italic, normal, or oblique (tilted toward the left).

If you want to set a particular segment to be set to italic, normal, or oblique style, use the font-style attribute.

Using font-weight for bold

You can make your font bold by using the font-weight CSS attribute, as shown in Figure 2-9.

Figure 2-9: The font-weight attribute affects the boldness of your text.

If you want to make some of your text bold, use the font-weight CSS attribute, like this:

“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>

Boldface

This paragraph is bold.

Font weight can be defined a couple ways. Normally, you simply indicate bold in the font-weight rule, as I did in this code. You can also use a numeric value from 100 (exceptionally light) to 900 (dark bold).

Using text-decoration

Text-decoration can be used to add a couple other interesting formats to your text, including underline, strikethrough, overline, and blink.

For example, the following code produces an underlined paragraph:

“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>

Underline

This paragraph is underlined.

Be careful using