CST 161 -- exams #1 & #2

Using only text, HTML tags, and Javascript, create a web page that conforms to the instructions and specifications given below.

TEST #1: Upload it to your folder as a text file named test1Yourname.html"
TEST #2: As a "takehome" exam, revise and improve this web page,
     and upload it as a text file named test2Yourname.html", by March 31.

INSTRUCTIONS


SPECIFICATIONS

1.) Specify a light yellow background color for the page.

2.) At the top of the browser window, display your full name (First and Last),
followed by "CST161 test #1" (for the in-class test, and "test #2" for the takehome).

3.)  At the top left, display the date and time when the page is being viewed
on the client's browser.  (To do this, you will need to use some Javascript.) 

4.)  In the upper-right corner of your web page, display your name in ORANGE, italic 
text, of slightly-larger than normal size.
--  Underneath your name, display the text "CST161" in GREEN text (with no italics),
using the smallest text size possible.
-- (NOTE:  If you wish, you may reverse these 2 colors, in honor of St. Patrick's Day!  ;^)

5.) Now, draw a horizontal line across the page.  ------------------------------------------

6.)  On the right side of the page, display some image,
with a width of 100 and a height of 80 pixels, and no border.  Call it image "P1".
--  On the left of the page, display another image,
with a width of 150 and a height of 120 pixels, and no border.  Call it image "P2".

7.)  When the mouse passes over either image (P1, P2), change it to a different image
--  Change back to the original image, when the mouse is no longer over the image.
(You'll need javascript event-handlers for onMouseOver= and onMouseOut= to do this.)

8.)  In the center of the page (between these two images), display the text "Test #1"
(or "Test #2" for the takehome version),  using the largest-possible font size.
--  Underneath this text, display your name in RED, "sans-serif" type of normal size.

9.) Make sure the following stuff starts below the bottom of both images.
10.) Then, draw two horizontal lines across the page (using HTML tags, not text dashes).
-------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------


11.) Make a numbered list (1,2,3,...) of any six tags used for physical markup of text.
For each tag, explain what it does (but do NOT display the effect).

12.) Make a list of three "logical" markup tags, using SQUARE bullets for each item.
13.) In a list with LARGE Roman Numerals, list at least four tags used to make a table.
14.) In a list with small Roman Numerals, list 5 properties used within the "TABLE" tag.

15.) Draw another horizontal line across the page.
-------------------------------------------------------------------------------------------

16.) Create a centered, 3-by-3 table, with numbers 1 thru 9 in the cells.  
Make the background color of each cell a different shade of light green
and the numbers in each cell a different shade of dark red.

17.) This table should have a thick border around it, and the numbers in the cells
should have plenty of space around them (at least 10 pixels in each direction).


18.) Create another table, aligned to the left side of the screen, looking like THIS:
	 ---------- ---------- ---------- ---------- ---------- ---------- 
	|A1        |B1        |C1        |D1        |E1        |F1        |
	|          |          |          |          |          |          |
	|          |          |          |          |          |          |
	|          |          |          |          |          |          |
	 --------------------- ---------- ---------- --------------------- 
	|A2   SPAN 2 CELLS    |C2        |D2        |E2   SQUARE 2x2      |
	|                     |          |          |                     |
	|                     |          |          |                     |
	|                     |          |          |                     |
	 --------------------- ---------- ----------|                     | 
	|    A3    |B3        |C3        |D3        |                     |
	|          |          |          |          |                     |
	| 2        |          |          |          |                     |
	|          |          |          |          |                     |
	| R        |---------- ---------- ---------- --------------------- 
	| O        |B4        |C4        |D4        |E4        |F4        |
	| W        |          |          |          |          |          |
	| S        |          |          |          |          |          |
	|          |          |          |          |          |          |
	 ---------- ---------- ---------- ---------- ---------- ---------- 
	|A5        |B5                              |E5                   |
	|          |                                |                     |
	|          |                                |                     |
	|          |                                |                     |
	 ---------- -------------------------------- --------------------- 

19.) Find an image that "tiles" nicely and use it as table background.

20.) In the cells of the above table, enter the following:	
[A1]
Place a very-large, red copyright symbol, exactly in the CENTER in this cell. (c)
[B1]
Display "X" squared (with an exponent of "2" raised to the right of it).
[C1]
Give this cell a yellow background, and display your first name in purple.
[D1]
At the bottom of this cell, display your last name in greenish-blue, on a pink background.
[E1]
Place an image in this cell. Change the background color of the entire page to LIGHT GREEN, when this image is clicked!
[F1]
Place another image in this cell. Change page background back to its original color, when it is clicked!
[A2]
How many different "OL" types are there? List them all in this cell.
[B2]
(Cell B2 does not exist!)
[C2]
Why is there no "B2"?
[D2]
In this cell, list at least five properties used in image tags.
[E2]
What image-tag property leaves 20 pixels of space above and below the image?
[A3]
Display at least four different foreign-language characters, using "entities"
[B3]
What follows the # character in a URL?
[C3]
What is the default value for the "protocol" in a URL?
[D3]
What does a "DNS" do?
[B4]
Approximately how many years elapsed between the start of Arpanet and the World Wide Web?
[C4]
What Javascript method is used to put a message in a pop-up window?
[D4]
What does a server return when a client sends it a legitimate request for a web page?
[E4]
What does the browser do with the information data that a server sends back?
[F4]
Can the server send a web page that changes files on the client's disk?

For the following question(s), describe the tags using parentheses "(" and ")"
instead of less-than and greater-than signs. Please do NOT use "<" and ">".

[A5]
Rewrite the following (silly) sequence of tags, using only ONE tag to do the same thing.
            (IMG SRC="dog.gif") (/IMG)
[B5]
Make the following HTML conform to XHTML standards:
(Do not increase the number of tags used.)
 
		Hello
		(BR CLEAR=ALL)
		(B)Goodbye(/B)
		(HR SIZE=4)
[E5]
Explain the difference between "MIDDLE" and "CENTER"