La première méthode a le gros avantage de n'utiliser que le langage CSS malheureusement Internet explorer ne gérant l'évènement :hover que sur des liens, cette méthode ne fonctionne pas correctement sur ce navigateur.

<style type="text/css">
.image {
	border: 0;
}
.image:hover  {
	border: #00F 1px solid;
}
</style>

Ici on détermine la class “image”.

<img class="image" alt="mon image" src="chemin_de_mon_image" border="0" />

On attribut à la balise image la class “image”

Cette méthode utilise du javascript et du Css. Elle est par contre compatible avec tous les navigateurs.

<script language="javascript" type=text/javascript>
function affich_cadre(arg) {
	arg.style.border = '#00F 1px solid'
}
function efface_cadre(arg) {
	arg.style.border = '0'
}
</script>

On créé deux fonctions la première permet d'afficher la bordure autour de l'image, la seconde permet d'effacer la bordure.
“arg” Correspond à l'élément sur lequel on veut afficher cette bordure il sera précisé lors de l'appel de la fonction.

<img onMouseOver="affich_cadre(this);" onmouseout="efface_cadre(this)" alt="Mon_image" "chemin_de_mon_image" border="0" />

onMouseOver: signifie au survol de la souris.
onMouseOut: signifie lorsque la souris ne survole plus.
On appel la fonction affich_cadre lorsque la souris survol l'image et la fonction efface_cadre lorsque la souris sort de l'image.
”(this)” permet d'indiqué à la fonction sur quel élément appliquer le cadre c'est à dire ici l'image survolé.

On peu faire aussi une methode 100% CSS compatible IE et firefox mais cela oblige a mettre une bordure a l'image même au repos. Car sinon, l'image se retrouve décalé de 1px

a {
/*
en affichant les lien en BLOCK avec un Float Left, le lien prend bien les dimenssions de l'image.
Le border au repos permet de pas avoir de dacalage au survol
*/
	display:block;
	float:left;
	border:1px solid #000
}
a:hover {
/*
Affiche le border au survol
*/
	border:1px dashed #888
}
a img {
/*
met une bordure de 0 au image contenu dans des liens
*/
	border:0
}

et le html donne :

<a href="#" ><img src="b147700d.jpg" /></a>