HTML, XHTML & CSS

34
Part III: Taking Precise Control Over Web Pages and Styles
✓ ex: A value that is relative to the x-height of the current font. An x-height
is the equivalent of the height of the lowercase character of a font, such
as 1.5ex.
✓ em: A value that is relative to the current font size, such as 2em. For any
given typeface, 1 em is equivalent to its point size. (Thus, a 16pt font has
an em size of 16pt: Get it?)
In fact, both 1em and 100% equal the current size.
Be careful when using these values; certain properties support only some
measurement values — length values, say, but not relative values. Don’t let
this jargon scare you. Just define the size in a value you’re familiar with. If
that doesn’t work, try something else.
CSS Structure and Syntax
A style sheet is made of style rules. Each style rule has two parts:
✓ Selector: Specifies the markup element to which style rules apply
✓ Declaration: Specifies how content described by the markup looks
You use a set of punctuation marks and special characters to define a style
rule. The syntax for a style rule always follows this pattern:
selector {declaration;}
A semicolon always follows each declaration to make it easier for computers
to distinguish them. A single selector can include one or more declarations,
as we explain later in this chapter. Furthermore, each declaration breaks
down into two sub-items:
✓ Properties are aspects of how the computer displays text and graphics
(for example, font size or background color).
✓ Values provide data to specify how you want text and images to look on
your page (for example, a 24pt font size or a yellow background).
You separate the property from the value in a declaration with a colon.
Each declaration ends with a semicolon.
selector {property: value;}