fall 2006
hw unit B, part II


  1. For this assignment, you will create several HTML files in Notepad.
  2. Type your name in the files and your email address as comments.
  3. Save your work!!!
    BEFORE YOU LEAVE THE LAB, make sure that you save your work (both HTML files and any images files you use) by storing them on a USB flash drive or by mailing them to yourself.
  4. When you are completely finished with all the steps, zip all your files together and email the zip file to me as an attachment. To this by running the WinZip program and adding the homework files to the zip archive when it is created.
  5. My email address is:
The assignment is due (both parts) on Monday September 25, 2006.


NOTE: be sure to finish Part I before you begin Part II.


Step 0. Introduction to Style Sheets.

Cascading Style Sheets or CSS files provide a way to control the look-and-feel of your web page that is more convenient, more flexible and more comprehensive than adding parameters to HTML tags (like <td bgcolor="blue">). Style sheets let you define a wide range of settings such as colors, font types, font sizes, boxes around regions on your web page and spacing between various types of elements on the page.

There are two ways to use style sheets. The first way is to use the <style> tag within your HTML file header. Here is an example:

<title> my pretty html file </title>
<style type="text/css">
body { color: black; background: white; }
hello world

The second way is to create a separate CSS file that contains the style sheet commands. An example of a style sheet command is:

body { color: black; background: white; }

where body is the element on the web page to which the parameter settings apply (text and background colors, in this case). Here, you need to add a tag inside the <head> that tells the HTML file where it can find the style file:

<link type="text/css" rel="stylesheet" href="style.css">

You can get a lot more information on style sheets from this on-line tutorial guide:
more than you ever wanted to know here:


Step 1. Use style sheets to set table properties.
(1 point)
Use a style sheet to set at least three properties of the table you created in the second HTML file (recipe) from Part I of the assignment. The syntax for changing the colors of all the table cells and text is:

table { color: black; background: white; }

Note the use of punctuation: the open-curly-bracket { at the beginning of the list of properties being set, the close-curly-bracket } at the end of the list of properties being set, the colon : after the name of each property being set, and the semi-colon ; after the name of each property value.

Table properties that can be set include:

name description possible values
color color of text in table cells any valid color name or hex value
background background color for table cells any valid color name or hex value
font-family font specification for text in table cells examples: serif, sans-serif, monospace, courier, verdana
font-size size of font in table cells relative (e.g., 200%) or absolute (e.g., 8pt) values

You can choose whether you want to include the CSS commands in your HTML file or create an external style.css file. If you do create an external file, don't forget to submit it along with the HTML files!


Step 2. Use style sheets to set DIV properties.
(1 point)
A web page can be divided up into sections, where each section is called a DIV. Then you can set parameter values for the DIV.

First, create a file named style.css. Put in some tags to change the color of the text and background in your document.

Then, in your first HTML file (the one with the list, from part I), create a DIV like this:

<div class="list">
my favorite things to eat:
<li> chocolate
<li> chocolate
<li> chocolate

and in your style file, create an entry like this:

div.list { color: purple; background: yellow; border: solid; border-width: 5pt }

and play with the property settings of div.list in your style file to make it look nifty.


Step 3. Off-line question.

On Monday September 18, we talked in class about algorithms. We discussed four different types of algorithms: sequential, parallel, divide-and-conquer and binary. We solved the problem of finding two people in the class who have the same birthday using each of these types of algorithms, and we compared the different approaches (e.g., how long it takes an algorithm to run in the worst case, how much the computer has to remember while an algorithm is running, etc.).

Here are two new problems:

  1. Find any two people in the class who live on the same street.
  2. Find how many people in the class live on the same street.

  • Create a text file in Notepad and write your answers to the questions below in that file.
    Include that file in the ZIP package of HTML and style files you're submitting for this assignment.

  • question 1 (2 points)
    Which type of algorithm would you choose to solve problem A? Why? Describe how you could use each of the four types of algorithms and defend your choice by explaining why you feel the one you've chosen is better than the others.
    Hint: there is no "right" choice! Any of them can be used to solve the problem, and they all have different strengths and weaknesses. Your task is to explain the strengths and weaknesses and provide your opinion about why you would choose one over another.

  • question 2 (1 point)
    Now think about problem B. How is it different from problem A? Explain how your chosen algorithm would be modified in order to solve problem B instead of problem A.

    Remember, the whole assignment---everything here in addition to your answers to Part I---is due on Monday September 25.