HTML and CSS Reference
In-Depth Information
Apply your
knowledge of
CSS3 and mobile
styles to design
a page for a golf
Case Problem 2
Data files needed for this case Problem: arrow.png, gray.png, h01.htm - h18.htm,
hole01.jpg - hole18.jpg, holes.css, modernizr-1.5.js, wcback.png, wcbase.css,
wceffectstxt.css, wclayout.css, wcmobiletxt.css, willet.jpg, willet.png, willettxt.htm
Willet Creek Golf Course Willet Creek is a popular golf course resort in central Idaho.
You've been asked to work on the design of the resort's Web site by Michael Carpenter,
the head of promotion for the resort. He would like you to add some CSS3 visual effects
for drop shadows and gradients. Figure 8-66 shows a preview of the screen version of the
Web page.
figure 8-66
Willet creek page
Complete the following:
1. In your text editor, open the willettxt.htm and wceffectstxt.css files from the
tutorial.08\case2 folder included with your Data Files. Enter your name and the
date in the comment section of each file. Save the files as willet.htm and wceffects.
css , respectively.
2. Go to the wceffects.css file and create a shadow effect for the body element. The
effect should contain two box shadows, both with a color value of (31, 61, 31) and
an opacity of 0.9. Place the first shadow with a horizontal offset of 20 pixels, a verti-
cal offset of 0 pixels, and a blur of 25 pixels. Do the same for the second shadow,
except place the shadow with a horizontal offset of
20 pixels.
Search WWH ::

Custom Search