1. Include an h3 that contains your name and section.

2. Include an h1 that says: The Grand Canyon with the word Grand in a span element.

3. Insert two images of the Grand Canyon and give them the same height and width so that they will fit on one line by side by side. All images are to be saved in a folder called Lab7_Images.

4. Put one div around the images and use a local style (in-line) in the div to center the images using the CSS text-align property.

5. Insert an h2, and a short paragraph about the Grand Canyon. You decide the content, only a few sentences in the paragraph.

6. Write the JavaScript code so that when you to mouse over the word Grand in the span element in the h1, the word Grand changes to red. Hint: Use the event handler, onmouseover, in the span element. And write an assignment statement using this.style.

Note: We use this.style in an assignment statement to change the style of the element you are on.

7. Write the JavaScript code so that when you mouse over the div that contains the images, (You are putting onmouseover inside the div element.) the h1 changes to read: The Grand Canyon is Beautiful! Hint: Give the h1 an id and use getElementById (the id goes here).innerHTML in an assignment statement to change text. Note: getElementById is used when you want to mouse over one element and change a different element. innerHTML is used to change the text in the element.

8. When you click on the h2

1. Change the background color of the webpage to a color that you select (Usedocument.body.style.backgroundColor)
2. Change the font size of this h2 to 34pt (Use this)
3. Change the font size of the h3 to 64pt (Use getElementById. )

9. When you mouse over the paragraph use JavaScript to make something happen.

Insert an HTML comment to tell what you did.