Building the User Interface by Using HTML5: Text, Graphics ... - server

Building the User Interface by Using HTML5: Text, Graphics, and Media | 37✚ MORE INFORMATIONTo learn more about displaying images on Web pages, go to http://bit.ly/Kgg1ab. You can find out more aboutimage maps at http://bit.ly/hincW5.DISPLAY AN IMAGE IN A WEB PAGEGET READY. To display an image in a Web page, perform the following steps:1. Locate a JPG, PNG, GIF, or BMP file on your computer to use in this exercise. The imagecan depict anything you want, but something to do with pets would be most appropriate.2. In your editing tool, open L2-pet-mark.html.3. Remove the tags from the first paragraph.4. Insert the following markup after the h1 element, leaving a blank line before andafter it, and replacing dogwalk.jpg with your own image file:Happy dogs are good dogs5. Create a new file by saving it as L2-pet-image.html and view it in a Web browser.The page should look similar to Figure 2-12.LICENSED PRODUCT NOT FOR RESALEFigure 2-12The Web page with an imageIllustration: © MightyIsland/iStockphoto6. Leave the editing tool and Web browser open if you’re continuing immediately to thenext exercise.USE THE FIGURE AND FIGCAPTION ELEMENTSGET READY. To display an image in a Web page, perform the following steps:1. Locate two additional JPG, PNG, GIF, or BMP files to use in this exercise. The imagecan depict anything you want, but something to do with pets would be most appropriate.You should have three images to work through these steps.2. In your editing tool, open L2-pet-image.html if it’s not already open.