CSS : backgroun-image
Charlotte
-
rdbois Messages postés 22 Statut Membre -
rdbois Messages postés 22 Statut Membre -
Bonsoir,
J'ai un petit problème avec mon css. J'aimerais avoir une image de fond qui change quand on passe la souris dessus, mais apparement il y a un problème, et je ne trouve pas la solution!
Voici le code html :
<a href="https://www.google.be/?gws_rd=ssl" class="interdit"> bonjour</a>
Et voilà le css:
a.interdit:link {
background-image : url(../images/interdit1.gif);
}
a.interdit:visited {
background-image : url(../images/interdit1.gif);
}
a.interdit:hover {
background-image : url(../images/interdit.gif);
}
a.interdit:active {
background-image : url(../images/interdit.gif);
}
L'image interdit1.gif ne s'affiche pas, et l'image interdit.gif non plus.
Merci d'avance pour votre aide,
Charlotte
J'ai un petit problème avec mon css. J'aimerais avoir une image de fond qui change quand on passe la souris dessus, mais apparement il y a un problème, et je ne trouve pas la solution!
Voici le code html :
<a href="https://www.google.be/?gws_rd=ssl" class="interdit"> bonjour</a>
Et voilà le css:
a.interdit:link {
background-image : url(../images/interdit1.gif);
}
a.interdit:visited {
background-image : url(../images/interdit1.gif);
}
a.interdit:hover {
background-image : url(../images/interdit.gif);
}
a.interdit:active {
background-image : url(../images/interdit.gif);
}
L'image interdit1.gif ne s'affiche pas, et l'image interdit.gif non plus.
Merci d'avance pour votre aide,
Charlotte
A voir également:
- CSS : backgroun-image
- Css download - Télécharger - HTML
- Enlever soulignement lien css ✓ - Forum CSS
- Comment créer un lien non souligné ✓ - Forum Réseaux sociaux
- Css ligne horizontale ✓ - Forum CSS
- Aligner horizontalement css - Forum CSS
3 réponses
.interdit:link {
background-image : url(../images/interdit1.gif);
}
.interdit:visited {
background-image : url(../images/interdit1.gif);
}
.interdit:hover {
background-image : url(../images/interdit.gif);
}
.interdit:active {
background-image : url(../images/interdit.gif);
}
.interdit a:link {
background-image : url(../images/interdit1.gif);
}
.interdit a:visited {
background-image : url(../images/interdit1.gif);
}
.interdit a:hover {
background-image : url(../images/interdit.gif);
}
.interdit a:active {
background-image : url(../images/interdit.gif);
}
Bonsoir,
Désolée pour le retard.
J'ai essayé le code, mais c'est toujours pareil, aucune image ne s'affiche ... On ne sait pas plutôt faire ca en javascript comme le code css ne veut pas fonctionner?
Charlotte
Désolée pour le retard.
J'ai essayé le code, mais c'est toujours pareil, aucune image ne s'affiche ... On ne sait pas plutôt faire ca en javascript comme le code css ne veut pas fonctionner?
Charlotte
Salut,
Non, ce que tu veux faire ce fait très bien en css...
1)Essaye de quoter les sources de tes images, du style :
.interdit a:link
{
background-image : url("../images/interdit1.gif");
}
.interdit a:visited
{
background-image : url("../images/interdit1.gif");
}
.interdit a:hover
{
background-image : url("../images/interdit.gif");
}
.interdit a:active
{
background-image : url("../images/interdit.gif");
}
2)Vérifie quand même si tes images sont bien placées au bon endroit ! Ex : en tapant www.monsite.fr/dossier_courant/../images/interdit.gif
3)Perso, j'aurais plutôt mis
<div class="interdit">
<a href="https://www.google.fr/?gws_rd=ssl">Mon lien</a>
</div>
Cordialement,
Non, ce que tu veux faire ce fait très bien en css...
1)Essaye de quoter les sources de tes images, du style :
.interdit a:link
{
background-image : url("../images/interdit1.gif");
}
.interdit a:visited
{
background-image : url("../images/interdit1.gif");
}
.interdit a:hover
{
background-image : url("../images/interdit.gif");
}
.interdit a:active
{
background-image : url("../images/interdit.gif");
}
2)Vérifie quand même si tes images sont bien placées au bon endroit ! Ex : en tapant www.monsite.fr/dossier_courant/../images/interdit.gif
3)Perso, j'aurais plutôt mis
<div class="interdit">
<a href="https://www.google.fr/?gws_rd=ssl">Mon lien</a>
</div>
Cordialement,
Merci d'avance,
Charlotte
Si quelqu'un saurait m'aider...
Charlotte