Summary

The purpose of this lab is to get you to practice using images, tables, and CSS classes within a web page. Additionally, you'll debug (aka fix) a broken web page that has a few mistakes that come up often. In the end, you'll verify that your page is XHTML strict.

Setup

Download the webpage here and, as in past labs, save it to your desktop/My Documents/somewhere. Rename it to have include your Pitt username (e.g., "rym4_lab3.html"). Then, open it up in your browser of choice and view it.


Now also look through the CSS and XHTML. See if you can spot any obvious errors.


If you view it without fixing anything, the page looks basically okay. Imagine though that you're doing this page for someone who has a certain look in mind:

  1. Make unordered lists use a square bullet
  2. Make h1 and h2 text centered
  3. Change how links look:
    1. Unvisited links should be dark blue (not underlined)
    2. Visited links should be dark blue (not underlined)
    3. Links which the mouse is hovering over should be blue (and underlined)
  4. Center the image at the bottom of the page
  5. Make the copyright notice at the bottom of the page centered (using a CSS class)
  6. Make the hr tags used underneath an h1 span the entire width of the page (use a CSS class)
  7. Make the hr tags used underneath an h2 span 50% of the page (use a CSS class)
  8. The table of cockney slang should be changed to actually be a table, instead of just preformatted text.
    1. Use <th> for the table headers. Make the headers bold and underlined.
    2. Use the <em> tag to emphasis each slang word when used in the example sentence

Now that you're done, do some work to make sure that the page verifies as XHTML strict.

Submission

After you're done:

  1. Call me over
  2. Show me that your page verified as XHTML strict
  3. I'll check off your name/give you credit for doing the lab.
  4. Enjoy the week