In this exercise, you will be inserting an image into different positions throughout this document. The image can be found at:
http://faculty.etsu.edu/tarnoff/labs1710/images/image.gifThe image is 75 pixels wide by 50 pixels high. You may download the image to your local disk or simply use the absolute URL as identified in the link above. Make sure you can complete each exercise before moving to the next one. This is just an in-class exercise and will not be turned in for grading.
Remember that if you are using Internet Explorer to download this file, the best way to do it is to select the menu item View --> Source. This will open the document in Notepad exactly as it is downloaded. Simply save it from Notepad to your local directory. Remember that when you save it, you should use double-quotes around the file name so that Notepad does not add the file extension ".txt" to the end of your file.
Below this paragraph, insert the image surrounded by paragraph tags, <p>...</p>. Set the align attribute of the paragraph tags to "center" so that the image is centered. Be sure to define the image's height and width and set its alternate text to "This image is part of the second CSCI 1710 in-class lab." (Remember to add the period as if the alternate text were a sentence!)
Below this paragraph, insert the image surrounded by paragraph tags, <p>...</p> Set the align attribute of the paragraph tags to "center" so that the image is centered. This time, however, double the height value and cut the width value by one third. This should make the dimensions 100 pixels high by 25 pixels wide.
Below this paragraph, insert the image surrounded by paragraph tags, <p>...</p> Set the align attribute of the paragraph tags to "center" so that the image is centered. This time, however, make an error in the URL for the src attribute so that the image doesn't download properly. What does the browser do with this error?
Below this paragraph, insert the image surrounded by paragraph tags, <p>...</p> Set the align attribute of the paragraph tags to "center" so that the image is centered. Use the border attribute to create a border 10 pixels wide around the image
Insert the image within this paragraph. The image should be placed to the far left of the paragraph so that the text surrounds it to the right and below it. The remainder of this paragraph is garbage text added so that the paragraph will be large enough for the text to surround. Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text
Repeat exercise 5 with this paragraph except that the image should be placed to the far right of the this paragraph with the text wrapping around the image. Once again, the remainder of this paragraph is garbage text added so that the paragraph will be large enough for the text to surround. Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text -- Useless text
Insert the image in this paragraph with the align attribute set to "bottom".
Insert the image in this paragraph with the align attribute set to "middle".
Insert the image in this paragraph with the align attribute set to "top".
Make the ETSU logo at the top of this page a link to the URL http://www.etsu.edu/. Be sure to remove the border for the link.