• Choose a category
• All
• Classic-Fiction

♦ Line-height: Indicates the vertical spacing between lines in the element. Like letter and word spacing, you’ll probably be disappointed if you’re this concerned about exactly how things are displayed.

Using the font shortcut

It can be tedious to recall all the various font attributes and their possible values. Aptana and other dedicated CSS editors make it a lot easier, but there’s another technique often used by the pros. The font rule provides an easy shortcut to a number of useful font attributes. The following code shows you how to use the font rule:

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

Using Font shortcut

This paragraph has many settings.

Figure 2-13 illustrates the powerful font rule in action.

Figure 2-13: The font rule can change many things at once.

The great thing about the font rule is how it combines many of the other font-related rules for a simpler way to handle most text-formatting needs.

The font attribute is extremely handy. Essentially, it allows you to roll all the other font attributes into one. Here’s how it works:

♦ Specify the font rule in the CSS.

♦ List any font-style attributes. You can mention any attributes normally used in the font-style rule (italic or oblique). If you don’t want either, just move on.

♦ List any font-variant attributes. If you want small caps, you can indicate it here. If you don’t, just leave this part blank.

♦ List any font-weight values. This can be “bold” or a font-weight number (100–900).

♦ Specify the font-size value in whatever measurement system you want (but ems or percentages are preferred). Don’t forget the measurement unit symbol (em or %) because that’s how the font rule recognizes that this is a size value.

♦ Indicate a font-family list last. The last element is a list of font families you want the browser to try. This list must be last, or the browser may not interpret the font attribute correctly. (Dadhand is a custom font I own; cursive will be used if Dadhand is not available.)

The font rule is great, but it doesn’t do everything. You still may need separate CSS rules to define your text colors and alignment. These attributes aren’t included in the font shortcut.

Don’t use commas to separate values in the font attribute list. Use commas only to separate values in the list of font-family declarations.

You can skip any values you want as long as the order is correct. For example

font: italic “Comic Sans MS”, cursive;

is completely acceptable, as is

font: 70% sans-serif;

Working with subscripts and superscripts

Occasionally, you’ll need superscripts (characters that appear a little bit higher than normal text, like exponents and footnotes) or subscripts (characters that appear lower, often used in mathematical notation). Figure 2-14 demonstrates a page with these techniques.

Figure 2-14: This page has super-scripts and subscripts (and, ooooh, math!).

Surprisingly, you don’t need CSS to produce superscripts and subscripts. These properties are managed through HTML tags. You can still style them the way you can any other HTML tag.

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

A² + B² = C²

i₀ = 0