image lien

2 participants

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu image lien

Message par Hayari Dim 29 Sep 2013 - 17:07

Bonjour !

Voila je voudrais savoir comment faire une image lien. En cliquant dessus, elle renvois sur une autre page du forum. Je voudrais aussi savoir comment faire pour, quand on ne le survole pas, qu'elle ai une opacité de 80%, et au survol ça revient a 100%. Merci de votre réponse!


Dernière édition par Hayari le Dim 29 Sep 2013 - 19:08, édité 1 fois
Hayari

Hayari
****

Féminin
Messages : 230
Inscrit(e) le : 30/04/2012

http://t-i-s.forumactif.org/
Hayari a été remercié(e) par l'auteur de ce sujet.

Résolu Re: image lien

Message par Self Dim 29 Sep 2013 - 17:54

Bonjour ^^.

Il va falloir donner une class à votre image on va donc commencé par la mise en forme HTML d'une image qui fait aussi office de lien:
Code:
<a href="MON LIEN" target="_blank"><img class="imagelien" src="LIEN DE MON IMAGE" /></a>
Alors il faut bien sur changer MON LIEN par le lien de la redirection au clique sur l'image.
Le target="_blank" lui sert à ouvrir la page dans un nouvel onglet.
class="imagelien" et un identifiant dont on va se servir pour l'opacité.
Et pour finir il faut remplacé LIEN DE MON IMAGE par le lien de l'image Wink.

Maintenant pour l'histoire d'opacité, on va mettre le code suivant dans la feuille de style CSS:
Code:
.imagelien{
opacity:0.8;}
.imagelien:hover{
opacity:1;}
Le code est simple, on à repris l'identifiant imagelien qu'on avait dans le code dans cette partie class="imagelien" pour lui appliquer un opacité de 80% représenté par opacity:0.8 dans le code CSS.
Nous appliquons ensuite :hover qui veut dire au passage de la souris à notre identifiant pour le rendre totalement opaque avec opacity:1.

Cordialement Smile .
Self

Self
Membre actif

Masculin
Messages : 3853
Inscrit(e) le : 13/06/2013

https://selfback.forumactif.com/
Self a été remercié(e) par l'auteur de ce sujet.

Résolu Re: image lien

Message par Hayari Dim 29 Sep 2013 - 19:04

Re !

Merci beaucoup pour ces petites explications très faciles a appliquer, ça marche parfaitement!
Sujet résolu Wink
Hayari

Hayari
****

Féminin
Messages : 230
Inscrit(e) le : 30/04/2012

http://t-i-s.forumactif.org/
Hayari a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum