[Résolu] Liens et effets de liens sur images

Salut à tous,
malgré avoir cherché plusieurs informations à droite à gauche je n'arrive pas à faire ceci:

je voudrais mettre un effet d'un lien sur une image,

image normale et même effet après avoir cliqué dessus

border: 3px solid #000000

image survolée

border: 3px solid #FFFFFF

Seulement bien sûr comme je n'ai pas que cette image ayant un lien celles-ci prennent le même effet jusqu'ici normal.
Mais maintenant je voudrais donner cet effet à toutes les images se trouvant dans la même class.

voici le bout de code actuel.
html

<div class="cadre-crea"><a href="images/folio/wist2.png"><img src="images/folio/a-wist2.png" width="52" height="52" alt="wist2" /></a></div>

j'ai vu sur certains site que l'on doit mettre "class" dans la balise img mais j'ai essayé, je pense avoir mal fait ceci donc je reprend à zéro et je demande aux meilleurs ( petit léchage de bottes ^^)

Merci pour ceux qui vont trouver la solution à ce petit problème.

Modifié par bart77 (18 Feb 2009 - 09:55)

Bonsoir bart77,

Si l'on prend ton code en l'état (as-tu réellement besoin de ces div ?...)

.cadre-crea a img{ border: 3px solid #000000;}
.cadre-crea a:hover img{ border: 3px solid #FFFFFF;}

devrait te fournir ce que tu sembles vouloir obtenir.

Dans le cas où tu souhaiterais te dispenser de ces div en collant cette casse aux images, tu pourras procéder de la sorte :
css :

a img.cadre-crea { border: 3px solid #000000;}
a:hover img.cadre-crea  { border: 3px solid #FFFFFF;}

html :

<a href="images/folio/wist2.png">
<img class="cadre-crea" src="images/folio/a-wist2.png" width="52" height="52" alt="wist2" />
</a>
<a href="images/folio/wist3.png">
<img class="cadre-crea" src="images/folio/a-wist3.png" width="52" height="52" alt="wist3" />
</a>
<a href="images/folio/wist4.png">
<img class="cadre-crea" src="images/folio/a-wist4.png" width="52" height="52" alt="wist4" />
</a>

Te donneras le même résultat que précédemment, quelque soit et où que se trouve l'image dans ta page pourvu qu'elle porte la classe "cadre-crea" et soit encadrée par un lien.

Cdt,
Sylvain

merci ça marche nikel, je sais que pour vous c'est tout simple mais je ne pratique pas souvent le css donc un peu de lacunes mais merci ^^

bart77 a écrit :
merci ça marche nikel, je sais que pour vous c'est tout simple mais je ne pratique pas souvent le css donc un peu de lacunes mais merci ^^

Rien de spécialement évident ou de simple, il faut apprendre
La réponse peut également être différente selon l'usage que tu souhaites faire de ces effets sur images...

Si tu considères ce sujet comme [résolu] merci de l'indiquer dans le titre en éditant ton premier message

Cdt,
Sylvain

Voilà c'est corrigé