HTML and CSS Reference
In-Depth Information
Introducing CSS
You and Tammy met to discuss her ideas for upgrading the design of the Sunny Acres
Web site. She's created a few sample pages that she wants you to work with:
•
home.htm
—the home page, describing the operations and events sponsored by
the farm
•
maze.htm
—a page describing the farm's corn maze
•
haunted.htm
—a page describing the farm's annual Halloween Festival and
haunted maze
•
petting.htm
—a page describing the farm's petting barn
•
produce.htm
—a page describing the Sunny Acres farm shop and the pick-your-own
produce garden
Figure 3-1 shows the links among these sites in the Sunny Acres storyboard.
Figure 3-1
Storyboard of the Sunny Acres Web site
home.htm
haunted.htm
produce.htm
maze.htm
petting.htm
You'll start by opening these fi les in your text editor and browser.
To view the Sunny Acres Web pages:
◗
1.
Use your text editor to open the
haunttxt.htm
,
hometxt.htm
,
mazetxt.htm
,
pettingtxt.htm
, and
producetxt.htm
files, located in the tutorial.03\tutorial
folder included with your Data Files. Within each file, go to the comment section
at the top of the file and add
your name
and
the date
in the space provided. Save
the files as
haunted.htm
,
home.htm
,
maze.htm
,
petting.htm
, and
produce.htm
,
respectively, in the same folder.
◗
2.
Take some time to review the HTML code within each document so that you
understand the structure and content of the files.
◗
3.
Open the
home.htm
file in your Web browser, and then click the links at the
top of the page to view the current appearance of the
haunted.htm
,
maze.htm
,
petting.htm
, and
produce.htm
files. Figure 3-2 shows the current layout and
appearance of the Sunny Acres home page.