Writing HTML | Return to Lesson 7a |

Testing HTML for Lesson 7a: Percentage Scaling

This page demonstrates the use of the height and width attributes of the <img...> tag to resize an image. The original image is only 211 bytes in file size. In the lower HTML example, the inline image dimensions are expressed as a percentage of the browser window size rather than in exact pixel dimensions we saw in the first example. Test what happens when you shrink or stretch the size of the browser window (usually by clicking and dragging the lower right corner of the window)

Original
49 pixels wide and 25 pixels high, 0.2k file size
This HTML:

   <img src="../pictures/new.gif" alt="new!" width="49" height="25">

produces this image:

Percentage Scaling
80% of the browser window width and 40% of the browser window height, 0.2k file size.

This HTML:

   <img src="../pictures/new.gif" alt="new!" width="80%" height="40%">

produces this image:

Writing HTML: Testing HTML for Lesson 7a
©1994-1999 Maricopa Center for Learning and Instruction (MCLI)
Maricopa Community Colleges

The Internet Connection at MCLI is Alan Levine --}
Comments to alan.levine@domail.maricopa.edu

URL: http://www.mcli.dist.maricopa.edu/tut/tut7a_ex/test2.html