HTML and CSS Reference
EXAMPLE 14.13 ( CONTINUED )
6 <p>The text in this paragraph is green and the point size
is 16. The font family is <em>arial</em>.</p>
7 < p class="bigfont" > This paragraph has a bigger font and is
dark blue in color.</p>
8 <p>The font style is specified as a class called
9 < h1 class="bigfont" >Testing the Class on an H1 Element</h1>
10 < p class="teenyfont" >Is this a small font?"</p>
<p>Let's start a new paragraph. This is green with a font
size of 16. What style is in effect here?</p>
The style is defined in the <head> of the document.
The CSS starts here.
A rule is defined for the paragraph ( p selector). All paragraphs will have a right
margin, 30% in from both left and right. The Arial font will be 12 point and forest
A class selector called .bigfont is defined. Class names start with a period. When
used on an HTML element, the font will be extra large, dark blue, and bold.
The class selector called .teenyfont is defined. All HTML elements that use this
class will have a small, italic, black font.
The paragraph is styled according to the rule on line 3.
This paragraph is assigned the bigfont class. The text will be in the style defined
for this class on line 4.
This paragraph reverts to the style rule on line 3.
The <h1> tag is using the bigfont class defined on line 4.
The <p> tag is using the teenyfont class defined on line 5. See Figure 14.14.