We reviewed the CSS box model. I introduced the notion of the id attribute and how id's differ from classes. (Do you remember talking about the id attribute of an HTML element before today? Look back at pp. 152ff.) In a CSS rule selector, a class is identified by a period—e.g., .blueberry—while an id is identified by a pound sign—e.g., #navmenu.

I handed out an HTML cheat sheet and a CSS cheat sheet. Use these to trigger your memory about various things. Keep in mind that more details are available at DevGuru and other sites.

A couple of things to remember from last time:

• The unit em is the height of an M in the current font.
• If the levels of red, green, and blue in a color are the same, then the color is a shade of gray. #333333 (or #333) is a darker shade of gray and #aaaaaa (or #aaa) is a lighter shade.
• White is full intensity of all three colors (#ffffff) and black is the lack of all colors (#000000).

There will be a quiz next Wednesday. It will cover what we do through Monday's class.

Lab

I am starting a mail-order business called Dave's Daylilies. I know using a Web site to sell my products will be much cheaper than using printed catalogs. I sell daylilies, iris, and bird feeders.

Design a Web site for me. I know that eventually I will need to have the site use server-side scripting, but for now I think I can manage with static pages since my inventory is small: 12 kinds of daylilies, 15 kinds of iris, and 4 kinds of feeders.

Here is what I need users of my site to be able to do.

• Browse by type of product (daylily, iris, or birdfeeder). I should have a photo of each product eventually. I have a few already in a zip archive.
• Print an order sheet.
• Contact me via telephone, e-mail, or snail mail.
• Learn about the care of daylilies and iris. (Fortunately, they are pretty much care-free if they are planted correctly so there's not much to provide other than planting instructions, watering, and dividing.)
• Learn about the company.

What I'd like from you:

1. A design for the Web site—that is, the pages you recommend and how they are organized into folders.
2. A design for the home page, including what the navigation menu should be and what pages it links to.
3. A suggestion for the presentation. Since I'm just getting started, I could use a logo and a color theme.

For now, just use lorem ipsum to fill out the text parts of the pages that discuss products and product care.

Homework

Read the rest of Chapter 10 and complete the work-along exercise. Be sure your HTML file and your CSS file validate.

When you have finished the exercise, send the files lounge.html and lounge.css as attachments to an e-mail message having the subject Chapter 10 Part B.