HTML and CSS Reference
In-Depth Information
Apply your
knowledge of
CSS3 and print
styles to design a
recipe page.
Case Problem 1
Data files needed for this case Problem: dw.png, dwbase.css, dweffectstxt.css,
dwlayout.css, dwprinttxt.css, halfstar.png, modernizr-1.5.js, recipetxt.htm, star.png,
torte.jpg
dessertWeb
Amy Wu has asked for your help in redesigning her Web site,
dessertWeb
,
taking advantage of some of the new CSS3 styles. The
dessertWeb
Web site is a cooking
site for people who want to share dessert recipes and learn about cooking in general. In
addition to redesigning the site's appearance, she wants you to create a print style sheet
so that users can easily print out recipes and ingredient lists without having to print the
headers, footers, and navigation lists that appear on each Web page. Figure 8-64 shows a
preview of the screen version of the page.
figure 8-64
dessertWeb page
Complete the following:
1. In your text editor, open the
recipetxt.htm
and
dweffectstxt.css
files from the
tutorial.08\case1 folder included with your Data Files. Enter
your name
and
the date
in the comment section of each file. Save the files as
recipe.htm
and
dweffects.css
, respectively.