However, you can also target speci?¬? c areas of your document by adding
IDs and class attributes to the tags in your XHTML markup. IDs
and classes give you a second approach to styling your document??”
one that can operate without regard for the document hierarchy.
SIMPLE USE OF A CLASS
Here??™s a piece of markup that illustrates how you might use a class
This is a heading with the same
class as the second paragraph
This tag has no class.
When a tag has a class attribute, we
can target it regardless of its position in the
hierarchy.
Note that I??™ve added the class attribute specialtext to two of these
tags. Let??™s now apply these styles to this markup where specialtext
is formatted as bold (Figure 2.9).
p {font-family: Helvetica, sans-serif;}
.specialtext {font-weight:bold;}
FIGURE 2.9 Here I use a class selector
to bold two different tags.
When you write a class selector,
start it with a . (period). Do not put
a space between the period and the
selector.
STYLIN??™ WITH CSS - CHAPTER 2 40
These rules result in both paragraphs displaying in the Helvetica
font (or the browser??™s generic sans-serif font if Helvetica is not
available) and the paragraph with the specialtext class displaying
in Helvetica bold. The text in the h1 tag remains in the browser??™s
default font (usually Times), but it is bold because it also has the
specialtext class.
Pages:
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71