HTML - The Basics

Images as links

Instead of a text link, you may like to make an image into a link. This is done using the A and IMG tags and some options also.

<A HREF="index.html"><IMG SRC="dragon.gif">
Link this to the Index</A>
Link this to the Index

The IMG tag is surrounded by the A tag. The result shows that the GIF file is surrounded by a border, the same colour as the written link. The border can be eliminated by inserting BORDER=0 in the image tag as follows:


<A HREF="index.html"><IMG SRC="dragon.gif" BORDER=0>
Link this to the Index</A>
Link this to the Index

Alternatively, you can insert the comment into the image tag as follows


<A HREF="index.html"><IMG SRC="dragon.gif"
BORDER=0 ALT="Link this to the Index">
</A>
Link this to the Index

There are no visual links, the reader must click on the image to navigate your site. If you leave a space between the IMG tag and the closing <A> tag, an small underline appears for instance:


<A HREF="index.html"> <IMG SRC="dragon.gif"
BORDER=0 ALT="Link this to the Index">
</A>
Link this to the Index


Previous : Index : Next