Here we wish to illustrate that the img element is
an inline element, as we see here ...
... with this very small (10-pixel by 10-pixel) image. Note how the
bottom of the image lines up with the bottom of
the line on which it appears, a reflection of the fact that an
img element is an inline element.
The orange square image displayed in the previous paragraph
is just a 10 pixel by 10 pixel image, but whatever the size of
the image is we should tell the browser. In this case, if we
do that, the display
looks exactly the same (of course).
On the other hand, if we want the image to be 10 times as
wide and 10 times as tall, we can do that too by setting the
width and the height and letting the browser scale the image.
Here is the result:
This is not a good idea, however. Much better is to use an external
program to make the image itself the size we want it to be, and then
tell the browser what this size is. That way, the browser has no
"scaling" to do, and our page will display that much faster.