(this is not an editorial comment on school lunches ;-\)
Now, I've decided that the image needs to fit into a shorter and wider space on the page -- so I change
the size attributes in the img src tag
(I'm changing width from 152 pixels to 250, and the height from 225 to 100)
As you can see, simply changing the size attributes has distorted the picture. This is why it is important to know the width and height of any image -- including buttons and bars.
In this next example I have simply doubled each of the size attributes:
Notice that the quality of the image is beginning to deteriorate. If the image were smaller to begin with, this deterioration would be even more pronounced.
And in every case the amount of memory being used to load the image is exactly the same, since I have not
changed the actual image -- I have changed the way the browser displays it.
To change the size or shape of an image, you should use a photo or paint program to re-size the original image, and not use the attributes to do that.