HTML and CSS Reference
2. The Home Page. Launch Notepad and open the index.html file. You will modify
this file to apply styles from the fishcreek.css external style sheet.
Add a <link /> element to associate the Web page with the fishcreek.css external
style sheet file. Save and test your index.html page in a browser and you'll notice
that the styles configured with the body and h1 selectors are already applied!
Configure the navigation area. Since the navigation is not semantically a
“paragraph” (a collection of sentences about a central topic), replace the <p>
element with a <div> element. Assign this <div> to the id named nav .
Remove the <strong> element from this area.
Configure each <dt> element to apply the category class. Remove the
<strong> elements from this area.
Configure the page footer area. Replace the <p> elements with <div> elements.
Assign this <div> to the id named footer . Remove the <small> and <em> ele-
ments because the font-size and font-style are configured as part of the
Save the index.html file and test in a browser. Your page should look similar to
the one shown in Figure 3.24 except that your page content will be left-aligned
instead of indented from the margins. Don't worry—you'll configure your page
layout in Step 4 of this case study.
3. The Services Page. Launch Notepad and open the services.html file. You will
modify this file in a similar manner—add the <link /> element, configure the
navigation area, configure the category classes (use <span> elements), and con-
figure the page footer area. Save and test your new services.html page. It should
look similar to the one shown in Figure 3.25 except for the alignment.