For the image to appear you simply use the <img src="image url goes here"> format. The image will be placed in whatever sized space it requires based on its original size.
            
Non-Hyperlinked Image                                  Hyperlinked Image

You can see that the format for linking is <a href=, then the URL within quotations, followed by a > and then the text that you want displayed for the link, followed by </a> to close the hyperlink: <a href="easylink.html">easylink.html</a>.
Your image will have a border unless you tell it you don't want one by using the border="0" descriptor within the img src= tag.

In order to resize it you just define the height and width after the url:
<img src="image url goes here" width="120" height="189">
For the image below the source code looks like:
<img src="../../../images/flyinglemur_213x335.gif" width="120" height="189">
The "../../../images part tells the browser where to find the image. For each ../ the browser looks one more level above the current folder. This image is placed in a folder called "images" and it is located at the same level as the site index file, three levels up from this current web page and folder.

Now, to make an image appear you simply use the <img src="image url goes here"> and place it behind the <a href="url goes here"> section and close the hyperlinked image with </a>

We can also make text appear when the user puts their cursor over the image by using the "alt" tag within the img src descriptor:

And this is how the source is written:
<img src="../../../images/flyinglemur_213x335.gif" width="120" height="189" alt="Hi! I'm a Flying Lemur!">