HTML and CSS Reference
In-Depth Information
Review Assignments
Practice the skills
you learned in
the tutorial using
the same case
scenario.
Data Files needed for the Review Assignments: alisha.png, cp_logo2.png,
modernizr-1.5.js, racetxt.css, rosetxt.htm, slide01.png-slide08.png
Dan wants your help in designing a layout for a Cycle Pathology Web page that describes
one of the group's upcoming tours. He would like you to use a fl exible layout with a list
of navigation links displayed on the left 20% of the page, with the remaining 80% of the
page width devoted to page content. He also wants the page to contain a slide show of
images from previous events displayed with a horizontal scroll bar. Figure 4-77 shows a
preview of the page you'll create for Dan.
Figure 4-77
Cycle Pathology tour page
Vaclav Volrab/Shutterstock.com
Complete the following:
1. Use your text editor to open the
rosetxt.htm
and
racetxt.css
fi les from the
tutorial.04\review folder. Enter
your name
and
the date
in the comment section of
each fi le and then save them as
rose.htm
and
race.css
, respectively.
2. Go to the
rose.htm
fi le in your text editor and take some time to review the content
and structure of the fi le. Link the fi le to the
race.css
style sheet and then save your
changes to the fi le.
3. Return to the
race.css
fi le in your text editor. Add a style rule to display the
header
,
article
,
aside
,
figure
,
figcaption
,
hgroup
,
section
, and
nav
elements as
blocks.
