CSCI 100 - Homework 6Fonts and friends

Due before midnight, Thursday 22 Mar 2007

In this assignment, you will be creating 2 HTML files and accompanying CSS style sheets using rules for fonts, text decorations, and the like.

Part 1 - Making folders

Make a folder called hw06. Inside it create 2 subfolders, pages, and css. Create additional folders as needed.

Part 2 - Starting point CSS

In order to get some experience using the CSS rules, I want you to start with the following line of CSS in your files:

* { font: normal xx-small monospace; }

This will force everything to be tiny, monospaced characters requiring you to write CSS rules to change them. Remember, you can have a set of CSS rules apply to more than one tag by having a comma separated list in the selector.

Part 2 - Create pages and CSS

As in the last project, you will be creating HTML/CSS pairs of pages with the same name. You can do them in any order.

For any special rules, you should define a class to contain the formatting.

Invitation

Create a page called invite.html with an accompanying CSS file invite.css. This will be used to create an invitation to an event of your choice.

Here is what I'd like you to do for this page:

1. Color choice is up to you
2. Font should be something from either the cursive or fantasy families.
3. A centered top-level header with a catchy line (e.g., "Party!", "You're invited!", etc.)
4. A paragraph describing the event
5. Info on the party with the labels being visually set off from their values. Include at least the following information:
   • Location - with a link to a map of the place like this: King Building note: you'll need to change all the &s in the URL to & to get it to validate (see below)
   • Date of the event
   • Time of the event
6. As the last item on the page, a right-aligned paragraph indicating whether or not an RSVP is required (in italics)

Feel free to include additional information and/or images.

Resume

Create a page called resume.html with an accompanying CSS file resume.css. Here you will be creating a resume for someone either real or fictional (maybe pick your favorite historical figure, cartoon character, etc. or just use yourself).

Here is what I'd like you to do for this page:

1. Color choice is up to you
2. Font should be something from either the serif or sans-serif families.
3. All second level headers should be bold, underlined, and left-aligned
4. All paragraph text should be fully justified
5. A top level header with your name (must have text-align specified)
6. Your address in <address> tags, right aligned
7. A horizontal rule (the <hr> tag)
8. A header for "Objective" or similar and a paragraph stating that objective
9. A header for "Education" or similar and that information (maybe a list?)
10. A header for "Experience" or similar and that information
11. Another horizontal rule (the <hr> tag)
12. A paragraph class for the usual References available upon request or similar that is centered and in italics. And then use that for the last paragraph.

Feel free to include additional sections and/or images.

Part 3 - Making index pages

Now you need to create an index.html file in your hw06 directory. Include in it links to to the 2 pages you created. You can style this with CSS if you want.

Honor Code

If you followed the Honor Code in this assignment, insert a paragraph attesting to the fact within this file as well. Create a "honor" paragraph class that centers and changes the color of the text (you can change other properties too if you want).

I affirm that I have adhered to the Honor Code in this assignment.

Update index.html

Update your index.html file in your csci100 directory with a link to this assignment.

Part 4 - Validate

Be sure all (X)HTML files are validated as either 4.01 Strict or XHTML 1.0, and all CSS files are valid CSS.

Part 5 - handin

Upload, set permissions, and so forth. You now just need to electronically handin all your files.

1. either ssh into cs.oberlin.edu or start a terminal from a lab machine
2. cd ~/www/csci100
3. handin -c cs100 -a 6 hw06

If you are using Terminal you can just do this as one command:

    ssh username@cs.oberlin.edu handin -c cs100 -a 6 www/csci100/hw06

Yippee!!! Last assignment before break!

Last Modified: March 14, 2007 - Benjamin A. Kuperman