New Perspectives on HTML and XHTML Tutorial 4 Case Problem 4

Description

New Perspectives on HTML and XHTML Tutorial 4 Case Problem 4

Data Files needed for this Case Problem: bizet.jpg, bizetbio.txt, bizetlist.txt, mozart.jpg, mozartbio.txt, mozartlist.txt, puccini.jpg, puccinibio.txt, puccinilist.txt, verdi.jpg, verdibio.txt, verdilist.txt, wagner.jpg, wagnerbio.txt, and wagnerlist.txt

Gresham Children’s Choir Faye Dawson is an instructor for Gresham Children’s Choir in Gresham, Oregon. The choir is a chance for talented youth to perform and to learn about music history. Faye is working on a Web site describing the history of opera. She’s asked for your help in creating a design. Faye has provided you with information on five different composers: Bizet, Mozart, Puccini, Verdi, and Wagner. For each composer, she’s given you an image file containing the composer’s picture, a text file listing the composer’s works, and a text file containing a biographical sketch. Use this information to design your Web site. You may supplement these files with any other material you think will enhance your site’s design.

Complete the following:
1. Use your text editor to create four HTML files named bizet.htm, mozart.htm, puccini.htm, verdi.htm, and wagner.htm, placing them in the tutorial.04\case4 folder included with your Data Files. Enter your name and the date in a comment section of each file. Include any other comments you think will aptly document the page’s purpose and history.
2. Use the provided text files and image files to create a Web page describing each composer’s life and accomplishments. Include hypertext links between the five composer Web pages.
3. Create an external style sheet named gresham.css for your Web site. Insert a comment section in the style sheet file that includes your name and the date as well as other comments that describe the style sheet.
4. The content of the gresham.css style sheet is up to you, but it must include the following features:
• Styles that use contextual selectors
• A style that uses a pseudo-element and a pseudo-class
• Styles that use positioning styles (either absolute or relative)
• A style that creates or modifies an ordered or unordered list
• A style to create a rollover effect
5. Create another style sheet named printer.css containing styles for a printed version of the pages in your Web site. Add appropriate comments to the different parts of your style sheet.
6. Test your Web site on a variety of browsers to ensure your design works under different conditions.
7. Submit your completed files to your instructor.