Here is the picture of the top of the page to imitate...
You may use the <style> paragraph for many of your CSS styling directives. You may also use attributes like style = "color: red;" inside HTML tags as well, when necessary.
Everything is centered -- you can do this with:
<div align="center"> put everything
that's inside the body here </div>
The menu font is "Comic Sans Ms"
When the cursor hovers over one of the menu links, it turns red (see Python-eater): Look at View-source for one of the homework server pages for a clue.
The picture and the two "Notes" are cells in a table. You'll need to do some clever things here.
You'll need a TABLE attirbute called "cellpadding" so that the text of the "Notes" cells do not abut the edge of the cell
This table is as large as necessary to accommodate the picture and "Notes" cells.
You'll need a TD atrribute called "rowspan" to make the cell carrying the picture twice the height of the cells containing the "Notes"
The menu links at the top do not go to other pages -- they go to sections on this page, which are in the second table
This table is set for 20% of the width of the window.
Learn about "bookmarks" which are target for internal links on a page.
Imagine that this webpage is very long, with long explanations of each of the menu items. You'd want the menu links, when activated, to take you down to the appropriate section in this long document, just like a Table of Contents would when clicking on a chapter. To do this, first of all, make your webpage very long by adding more gibberish to each of the 4 sections (Racketeeer, Python-eater, C creature and Java drinker). Then create "bookmarks" at each of the section titles, and then go back up to the menu items at the top and create links to these bookmarks.
