Tom Linton, Spring 2004, Central College
Due Monday 2-16
- Using internal and local CSS style declarations, make a web-page that looks similar to the image below (ignore the small grey strip across the top of the image, that comes from poor cropping of the image by me). Some notes:
- The "line" across the page is a horizontal rule, and comes from an
empty element whose basic form is:
<hr style="width: 50%; height: 5px; color: #you pick the color" /> - You set the background color and text color of the page by
adding a style attribute to the opening body tag, something like:
<body style="background-color: #pick a color code; color: #pick a color code for the text"> - The song titles are in a larger font (but not in bold) than the times of the songs. The fonts used on the page are Arial (a monospace font) and Chicago (a serif font), but you needn't worry about changing the fonts.
- In general, <div> elements have less vertical space
around them than do <p> elements, but <br>'s are best for
keeping things real close together.
- Find a recipe for some food you like and create a web page that uses internal and local styles to:
- Make the recipe title (food name) centered, underlined, in a large header.
- Has the ingredients in a monospace font, indented 0.5in from the left (set padding-left:.5in to achieve this), and uses <br>s between ingredient lines.
- Has the directions in normal paragraphs.
- Uses a smaller level header to add the "titles" Ingredients and Directions to the page.
- Make a simple webpage named mylinks.htm
(that is a full blown XHTML source document) that has some minimal
supporting text (like here is my recipe page etc.) that contains links
to your cd-cover page and your recipe page. This mylinks.htm file
should be submitted electronically via blackboard. You do NOT need to
email me, nor submit the cd-cover or recipe pages, as these will be
viewed using your links. The URL to your folder on the K drive is
http://www.central.edu/homepages/yourloginname, and most of you will
store all 3 of these documents in the webprog subfiolder of your K
drive folder. Once again, the basic form of a hyperlink is
<a href="full URL">TEXT FOR LINK</a>.