Deadline: Monday, October 29th, 2007, 4:15PM

Create A Web Site about Halloween

In this assignment, you're required to design a web site which talks about the popular holiday "Halloween".

What's given to you

A zip file which contains the text content and images you'll use in this assignment. It also contains the HTML file which has all the content already inserted, and a CSS stylesheet which has only two rules. The HTML file is already linked to the CSS stylesheet. You can either just add rules to / modify the CSS file to finish this assignment, or create your own HTML and CSS file to do it.

The zip file also contains a screen shot of the finished web page for your reference. You should make your web page look almost identical, although exactly the same will be better.

You can use any of the CSS technique introduced in the class, or you can come up with your own technique to realized the same effects.

Requirements

1. You shouldn't change the directory structure and location of the files given to you.

2. You HTML file should pass the W3C validation, and a validated CSS file is preferred too (although not required).

3. You should have title for the web page.

4. Here are some of the CSS values used for this web page:

• Main text: #550F0F.
• Body background: "cssimages/blood_love.jpg".
• Main container inside body: 700px wide, 25px padding on all sides.
• Header background: "cssimages/header.jpg".
• The text "Halloween" in the header section is a h1 header, and the text is replaced by the image "cssimages/halloween.gif" using the image replacement technique.
• Middle section: background is white, width 640px, 30px padding on all sides.
• The Subtitles (uses <h2> header) has a background image "cssimages/title_bg.jpg", the color of this subtitles is #D54F18; They use text-transformation to capitalize all letters, and uses a 10px letter spacing.
• All the main text have a 2em text indentation, and justified.
• Footer is 25px high, and has 5px padding on the top, and has a background image "cssimages/footer.jpg".
• The text "©2007" in the footer section is replaced by the image "cssimages/copyright.gif" using the image replacement technique.
• As you can see, the first letters "H", "T", "B", and "M" of paragraphs are replaced to an image of those letters using the drop caps technique.
• There are 3 images inserted through HTML, and they all have captions. Each image is placed inside a <div> which has a 1 pixel #6C0D09 border, and image itself also has a 1 pixel border whose color is #6C0D09.

5. After you're done, make a zip file which contains your HTML and CSS file and submit it to the "Assignment4" folder under the submission directory. MAKE SURE include your name in the zip file.

Screen shot of the page

index.html

<back to top>