Couleur bordure hyperlien
Résolu
erialc452
-
erialc452 -
erialc452 -
Bonjour,
J'ai utilisé une image comme hyperlien et j'y est ajouté une bordure. Ainsi la bordure est bleu, couleur normale d'un hyperlien. Mais j'aimerais changer la couleur de cette bordure et qu'elle change encore de couleur au survol de la souris dessus. Il me faut juste la "formule" de changement de couleur soit dans la balise d'image soit dans le css.
J'ai utilisé une image comme hyperlien et j'y est ajouté une bordure. Ainsi la bordure est bleu, couleur normale d'un hyperlien. Mais j'aimerais changer la couleur de cette bordure et qu'elle change encore de couleur au survol de la souris dessus. Il me faut juste la "formule" de changement de couleur soit dans la balise d'image soit dans le css.
A voir également:
- Couleur bordure hyperlien
- Bordure de page word - Guide
- Excel cellule couleur si condition texte - Guide
- Boite a couleur - Télécharger - Divers Photo & Graphisme
- Somme si couleur - Guide
- Pipette couleur word ✓ - Forum Powerpoint
24 réponses
salut,
et il faut respecter l'ordre !
a:link img{border-color:#000000;} /* apparence par défaut */ a:visited img{border-color:#FF0000;} /* page déjà visitée */ a:hover img{border-color:#00FF00;} /* survol */ a:active img{border-color:#0000FF;} /* bouton enfoncé au moment du clic */
et il faut respecter l'ordre !
On le met bien dans le css ? Je ne sais pas quoi mettre devant : div#contenu a:hover img... par exemple ou autre chose ? On regroupe ces 4 propriétés dans un seul div ? J'ai essayé de les séparer, j'ai fait :
div#contenu a:link img
{
color: #6E46B9 ;
}
div#contenu a:visited img
{
border-color:#FF0000;
}
div#contenu a:hover img
{
color: #edd7ff ;
}
div#contenu a:active img
{
border-color:#0000FF;
}
Ca n'a pas marché donc je n'ai pas dû faire comme il fallait.
div#contenu a:link img
{
color: #6E46B9 ;
}
div#contenu a:visited img
{
border-color:#FF0000;
}
div#contenu a:hover img
{
color: #edd7ff ;
}
div#contenu a:active img
{
border-color:#0000FF;
}
Ca n'a pas marché donc je n'ai pas dû faire comme il fallait.
j'aimerais changer la couleur de cette bordure
et en utilisant la propriété {border-color} ça irait peut être mieux, nan ?
-;o)
et en utilisant la propriété {border-color} ça irait peut être mieux, nan ?
-;o)
div#contenu a:link img
{
color: #6E46B9 ;
}
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
et ben même en le soulignant tu l'vois pas !
-:oD
donc compare ça : border-color
et le texte souligné dans ton code :
i'manquerait pas le "border-" par hasard ?
-:oD
donc compare ça : border-color
et le texte souligné dans ton code :
div#contenu a:link img { color: #6E46B9 ; } div#contenu a:visited img { border-color:#FF0000; } div#contenu a:hover img { color: #edd7ff ; } div#contenu a:active img { border-color:#0000FF; }
i'manquerait pas le "border-" par hasard ?
mais tu le fais exprès ou quoi ?
dans ta putain de règle tu as codé COLOR, c'est la couleur de premier plan, pas celle de la bordure :
il faut coder BORDER-COLOR pour changer la couleur de la bordure.
donc tu dois marquer ça :
ça veut pas dire que ça fonctionnera mais au moins ce sera juste.
dans ta putain de règle tu as codé COLOR, c'est la couleur de premier plan, pas celle de la bordure :
div#contenu a:link img { color: #6E46B9 ; }
il faut coder BORDER-COLOR pour changer la couleur de la bordure.
donc tu dois marquer ça :
div#contenu a:link img { border-color: #6E46B9 ; }
ça veut pas dire que ça fonctionnera mais au moins ce sera juste.
oui j'ai compris maintenant mais j'avais déjà réparé l'eurreur c'est pour ça. Donc même en rajoutant border devant ça marche pas.
donc maintenant il doit rester un problème de sélecteur ou de priorité.
as-tu une version en ligne ?
si non, il faut nous dire dans quelles balises sont incluses tes images.
as-tu une version en ligne ?
si non, il faut nous dire dans quelles balises sont incluses tes images.
non je ne l'ai pas mise en ligne donc :
<div id="contenu">
<p><a href="...........jpg"><img style="float: left;" src="...........jpg" border="3" align="texttop"></a>
<div id="contenu">
<p><a href="...........jpg"><img style="float: left;" src="...........jpg" border="3" align="texttop"></a>
salut,
ça devrait fonctionner.
on va faire un essai avec autre chose, ajoute ça à ta CSS :
et dis nous si tu vois le passage au rouge.
div#contenu p a:link img { border-color: #6E46B9 ; }
ça devrait fonctionner.
on va faire un essai avec autre chose, ajoute ça à ta CSS :
div#contenu p { background-color: red; padding:20px; }
et dis nous si tu vois le passage au rouge.
donc on cible bien le paragraphe ce qui veut dire que ça c'est correct :
le problème vient donc d'ailleurs…
je pense que c'est un problème entre visité ou pas.
on va faire un autre test, ajoute ça tout à la fin de ta CSS :
div#contenu p a:link img
le problème vient donc d'ailleurs…
je pense que c'est un problème entre visité ou pas.
on va faire un autre test, ajoute ça tout à la fin de ta CSS :
div#contenu p a:link img, div#contenu p a:visited img, div#contenu p a:hover img, div#contenu p a:active img, { border-color: red ; }
J'ai essayé et ça marche : le cadre est rouge tout le temps mais ça a changé la mise en forme du texte : hauteur de ligne trop grandde et le texte n'est plus justifié.
bon donc tu mettra ça :
et tu changeras couleur par couleur et tu testeras entre chaque.
pour les autres modifs, tu as dû laissé le premier test, il faut le virer.
et mets le code des liens en derniers, ça évitera qu'ils soient écrasés par une autre règle.
div#contenu p a:link img{ border-color: red ; } div#contenu p a:visited img{ border-color: red ; } div#contenu p a:hover img{ border-color: red ; } div#contenu p a:active img{ border-color: red ; }
et tu changeras couleur par couleur et tu testeras entre chaque.
pour les autres modifs, tu as dû laissé le premier test, il faut le virer.
et mets le code des liens en derniers, ça évitera qu'ils soient écrasés par une autre règle.
ca marche uniquement si je change toutes les couleurs : tout en rouge ca marche, tout en bleu aussi mais si je change une couleur, cette couleur ne s'affiche pas.
J'ai vérifié : c'est le div#contenu p a:active img
{
border-color: #edd7ff ;
}
qui change la couleur. Je l'ai enlevé et il n'y a plus de problème ça marche correctement.
{
border-color: #edd7ff ;
}
qui change la couleur. Je l'ai enlevé et il n'y a plus de problème ça marche correctement.
fais-tu la différence entre lien visité ou pas visité ?
si tu n'as jamais été sur la page cible du lien, la couleur utilisée est celle de "visited", sinon c'est de "link".
et le "hover", il fonctionne avec une autre couleur ?
comme ça par exemple :
si tu n'as jamais été sur la page cible du lien, la couleur utilisée est celle de "visited", sinon c'est de "link".
et le "hover", il fonctionne avec une autre couleur ?
comme ça par exemple :
div#contenu p a:link img{ border-color: red ; } div#contenu p a:visited img{ border-color: red ; } div#contenu p a:hover img{ border-color: green ; } div#contenu p a:active img{ border-color: red ; }