Let's start w/a basic image tag: <IMG SRC="image.gif" ALT="text" WIDTH="specified in pixels" HEIGHT="ditto">.

Now, let's break down these attributes, one by one.

SRC-This is the source/url of your image file.

ALT-This is text that will be seen when you mouse over the image. Also, if some of your viewers have a TEXT ONLY Browser, they'll be able to see the text you wrote. So, it's probably a good idea to be somewhat descriptive.

WIDTH/HEIGHT (specified in pixels)-By specifying the width & height of your image, the browser makes it load faster, which makes, happy visitors! If you don't know the pixel width & height of your image, you can find out by using an Image Editor/Maker. For the sake of explanation, I'll use Photoshop. Click on the Image menu, then click Image Size. When the Image Size dialog box comes up, DON'T CHANGE ANYTHING! Just take note of the height & width, write them down if you need to.

Now, let's make Image Links

To begin, we need a basic link. If you dont know how to make a link, please refer to the links tutorial. Now here's our link: <A HREF="page.html"></A>.

Instead of putting text between the <A></A> tags like we would normally do, we put an image tag. If you'd like, you can refer back to that tutorial.

Here's how it'll look:
<A HREF="page.html"><IMG SRC="image.gif" WIDTH="specifiedinpixels" HEIGHT="ditto" ALT="description" BORDER="0"></A>

That's It, I hope this has been helpful!

Using CSS3 to produce an expanding stack of image links, suitable for the iPad etc.