Dreaweaver Practice Test 1

Create a new site called Bizarre Animal. Make sure that you create a local root folder with two subordinate folders called images and css. Make sure that you enable cloaking.

Include a page title "Bizarre Animals."

Import the word document below into a new Dreamweaver HTML page. Remember to create paragraph breaks between the side heading and the paragraphs.

Bizarre Animals Word Document

Save the web page with the name Bizzare_Animals. (Remember, all html pages are saved to your local root folder.)

Format the title Bizarre Animals, the first line of the word document with a H1 heading. Create a CSS H1 tag style with the following format:

Color- Red
Font-family - Comic Sans
Font-weight - Bold
Text aligned -Center

Format the eight paragraphs under each side headings to H3.

Create eight CSS class styles with the following format. Make sure you give the unique names. Apply each of the class styles to the eight side headings.

Blue text, comic sans font family, font weight bold, font size extra large.
Red text, comic sans font family, font weight bold, font size extra large.
Green text, comic sans font family, font weight bold, font size extra large.
Pink text, comic sans font family, font weight bold, font size extra large.
Orange text, comic sans font family, font weight bold, font size extra large.
Purple text, comic sans font family, font weight bold, font size extra large.
Yellow text, comic sans font family, font weight bold, font size extra large.
Lime Green text, comic sans font family, font weight bold, font size extra large.

Change the background of the web page to black and edit the H3 CSS style that changes the font color to white and set the text align to justify.

Create an inline style for the following works in the text that will format the words to yellow italicized.

First paragraph- Mitsukurinidae

Second paragraph - Mutillidae

Third paragraph - Psychrolutes marcidus

Fourth paragraph- Gavialis gangeticus

Fifth paragraph - Condylura cristata

Sixth paragraph - Daubentonia madagascariensis

Seventh paragraph -Synaxidae

Eighth paragraph - Ogcocephalus darwini

Download the picture files and place them in the correct folder.

Picture Files

Place your cursor in front of each paragraph, not the side headings, and insert the picture that goes with the paragraph. Insert using the Insert from the standard toolbar, the Insert panel, as well as the assets panel. Make sure you give the image a descriptive tag so that when a screen reader encounters the picture it will read what the picture is. Resize the pictures so that they line up with the paragraph.

Create a Image Left and Image Right class CSS style. Add a 20 pixel margin to the right of the Image Left and a 20 pixel margin to the left of the Image Right.

Apply Image Left to the 1st, 3rd, 5th, and 7th picture. Make sure that you side headings appear all the way to the right of the page. This means you may to move the side heading down so that they appear on their own line.

Apply Image Right to the 2nd, 4th, 6th, and 8th picture. Make sure that you side headings appear all the way to the right of the page. This means you may to move the side heading down so that they appear on their own line.

View your page in both browsers. Make adjustments as needed.

Add a link to the following side headings. Make the link open in a new window. When applying the link your text will turn blue. You will need to apply the class text color style to the text again.

Goblin Shark - http://www.sharks-world.com/goblin_shark/

The Panda Ant -http://pandaant.org/panda-ant-facts/

Blobfish - http://www.stunninginterestingfacts.com/2013/01/the-blobfish.html

Gharials - http://nationalzoo.si.edu/animals/reptilesamphibians/facts/factsheets/gharial.cfm

Star-Nosed Mole - http://www.biokids.umich.edu/critters/Condylura_cristata/

Aye-aye - http://animals.nationalgeographic.com/animals/mammals/aye-aye/

Yeti Crab - http://www.factzoo.com/invertebrates/yeti-crab-grows-on-food-in-hair.html

Red-Lipped Batfish - http://www.aboutfishonline.com/articles/redlipped.html

Check out the links by viewing them in a browser window.

Here is my completed page in picture format. Check your page for accuracy.

Mrs. Nicholson's Bizarre Animals Web Page