Images lab
 

Make a copy of your lab6.html.
Rename it lab7.html.
Remove the three 500px wide and 400px high, light blue div elements that we were using as place holders.

 

Continue working with the three sections, and the links to these sections from the top of the page:

  1. State or Country
  2. Capital of the State or Country
  3. Park or Area of Interest in the State or Country

Find images on the Internet, or use images from a digital camera or other source.

For the State or Country, use a scene that is typical of, or identifies, the State or Country.
Center this image, just below the heading for the State or Country section.
Put a solid colored border around the image.

For the Capital, use a picture of the capital building, or other important site in the capital city.
Float this image to the left with text to the right of the image, just below the heading for the Capital section.

For the Park or Area of Interest in the State or Country, use a picture that shows why the area is of interest.
Float this image to the right with text to the left of the image, just below the heading for the Park or Area of Interest section.

Use a background image. You may copy my bluegray.gif, or use some other image. Be sure it does not interfere with reading the text.

Provide a link or description of the source of each image, such as:
This image is from British Rail Map
The background image was taken by my cousin with her digital camera.

Add a fourth section, telling why you are interested in this State or Country.
Within a line of text in this section, put:

  • one blue rectangle aligned top
  • one lime green rectangle aligned middle
  • one red rectangle aligned bottom

Make the rectangles somewhere around 30 pixels in their dimensions.
You may use my images blue1x1.gif green1x1.gif red1x1.gif
Put a link to your new fourth section at the top of the page.

Do not use more than one image from a web site. (A web site is usually all the pages with the same name before the first slash in the page address.)

Provide links between your index.html page and your new lab7.html page.