No Borders Around Image Links

Suppose you have a button-like image that is inside a link. Users can click on the image to go to whatever resource the button represents. For example, this button link brings you to the home page for this guide:

<A HREF="http://www.idocs.com/tags/"><IMG SRC="idocs.gif"
HEIGHT=33 WIDTH=82 ALT="Idocs Guide to HTML"></A>

which creates this button link:

HTML Code Tutorial - Free Reference Guide for Help with HTML Tags Including Form, Frames, Tables, and more!

By default, putting an image inside a link puts a border around the image. However, most people browsing the web these days recognize "link situations" and know that the button is a link. So suppose you want to remove the border. It's actually quite easy. Just add BORDER=0 to the <IMG ...> tag:

<A HREF="http://www.idocs.com/tags/"><IMG SRC="idocs.gif"
BORDER=0 HEIGHT=33 WIDTH=82 ALT="Idocs Guide to HTML"></A>

which gives us this button:

HTML Code Tutorial - Free Reference Guide for Help with HTML Tags Including Form, Frames, Tables, and more!





About the Author
Copyright 1997-2002 Idocs Inc. Content in this guide is offered freely to the public under the terms of the Open Content License and the Open Publication License. Contents may be redistributed or republished freely under these terms so long as credit to the original creator and contributors is maintained.