Problème de lien avec css
Résolu
balthordu
Messages postés
58
Date d'inscription
Statut
Membre
Dernière intervention
-
parthi -
parthi -
Bonjour voila je me lance dans le css et j'ai un problème avec mon code css. je voudrai colorier des lien dans mon pied de page. Mais dans mon code je n'arrive pas à voir ou est ce que je me suis planté. C'est à dire que mes liens restent bleu puis violet(lorsque que l'on a cliqué dessus). Le plus bizzare est que le code que j'ai utlisé dans un menu marche (c'est adire que j'ai pu changé la couleur des liens). Ce que je veux c'esdt que les liens webmaster et webdesigners soit en blanc et que lorsque l'on met la souris dessus ils soient surligné de gris en et jaune. Je rappel que je l'ai fait dans une autre partie de ma page et sa MARCHE. Donc je n'arrive pas a voir mon erreur. Je joins les code css et html (je rappel que j'ai bien entendu mis un lien entre les 2 pages css et html, normal car le reste du code css marche). Merci pour votre aide.
Code page css:
code html
Code page css:
#pied_de_page { float: right; padding: 5px; margin-top: 40px; margin-right: 38px; text-align: center; color: black; /* background-color: #626262;*/ background-repeat: repeat-x; border: 1px solid black; } .element_pied_de_page a /* Tous les liens se trouvant dans le pied de page*/ { color: #FFFFFF; } .element_pied_de_page a:hover /* Quand on pointe sur un lien du pied de page */ { background-color: #313131; color: #E0A200; }
code html
<div id="pied_de_page"> <table border="0" center> <tr><td width=40%><img src="image/balthordu.jpg" alt="Webmaster Balthordu"></td> <td width=20%><!--Copyright BM² 2007<br>Tous droits réservés--></td> <td><img src="image/metatron.jpg" alt="Webdesigner Métatron"></a></td></tr> </table> <table border="0" center> <tr><td width=20%><h5><a href="image/balthordubig.bmp">Webmaster</h5> <td width=60%><h6>Copyright BM² 2007, Tous droits réservés</h6></td> <td><a href="image/metatronbig.jpg"><h5>Webdesigner</h5></a></td></tr> </table>
A voir également:
- Problème de lien avec css
- Partager des photos avec un lien - Guide
- Lien url - Guide
- Verificateur de lien - Guide
- Lien copié - Forum Mobile
- Lien mega ✓ - Forum Webmastering
5 réponses
salut,
pour mettre en page les liens il faut coder les quatre états de la balise <a> (lien, visité, survolé, actif) soit les pseudo-classes ":link", ":visited", ":hover" et ":active".
il faut impérativement les coder dans cet ordre !
pour t'en souvenir "LoVe HAte".
pour mettre en page les liens il faut coder les quatre états de la balise <a> (lien, visité, survolé, actif) soit les pseudo-classes ":link", ":visited", ":hover" et ":active".
il faut impérativement les coder dans cet ordre !
pour t'en souvenir "LoVe HAte".
#pied_de_page a:link { color:#fff; background-color: #626262; } #pied_de_page a:visited { color:#fff; background-color: #626262; } #pied_de_page a:hover { background-color: #313131; color: #E0A200; } #pied_de_page a:active { background-color: #313131; color: #E0A200; }
Non désolé sa ne marche pas.
merci quand meme
Je joins le code qui a marché avec le menu pour vous montrer que une partie de la page marche.
code css
code html
Plus cancereux que moi, tumeur !!!!! (P.Desproges)
merci quand meme
Je joins le code qui a marché avec le menu pour vous montrer que une partie de la page marche.
code css
#menu { float: left; /* Le menu flottera à gauche */ width: 120px; /* taille au menu */ } .element_menu { background-image: url("image/background menu.JPG"); /*background-image: url("images/motif.png");*/ background-repeat: repeat-x; border: 2px solid #E0A200; margin-bottom: 5px; /* Pour éviter que les éléments du menu ne soient trop collés */ } /* Quelques effets sur les menus */ .element_menu h3 /* Tous les titres de menus */ { color: #E0A200; font-family: Arial, "Arial Black", "Times New Roman", Times, serif; text-align: center; } .element_menu ul /* Toutes les listes à puces se trouvant dans un menu */ { list-style-image: url("image/puce.gif"); /* On change l'apparence des puces */ padding: 0px; /* Tous les côtés ont une marge intérieure de 0 pixels */ padding-left: 20px; /* ... mais on modifie ensuite la marge de gauche, donc celle-là fera finalement 20 pixels */ margin: 0px; /* Idem pour margin, ça nous évite d'avoir à en écrire 4 (margin-left, margin-right...) */ margin-bottom: 5px; /* Même chose que tout à l'heure, on modifie ensuite juste margin-bottom, mais tous les autres sont à 0px */ } .element_menu a /* Tous les liens se trouvant dans un menu */ { color: #FFFFFF; } .element_menu a:hover /* Quand on pointe sur un lien du menu */ { background-color: #313131; color: #E0A200; }
code html
<div id="menu"> <div class="element_menu"> <h3> Accueil</h3> </div> <div class="element_menu"> <h3>Download</h3> <ul> <li><a href="page1.html">Logiciels gratuits</a></li> <li><a href="page2.html">Logiciel Beta</a></li> </ul> </div> <div class="element_menu"> <h3>Comparateur</h3> <ul> <li><a href="page4.html">Nouveautés</a></li> <li><a href="page5.html">Bookmarks</a></li> </ul> </div> <div class="element_menu"> <h3>Liens</h3> <ul> <li><a href="page4.html">Clubic</a></li> <li><a href="page5.html">barre google</a></li> </ul> </div> </div>
Plus cancereux que moi, tumeur !!!!! (P.Desproges)
ceci fonctionne chez moi (en local) cela devrai donc en faire de meme chez toi
<style>
#pied_de_page
{
float: right;
padding: 5px;
margin-top: 40px;
margin-right: 38px;
text-align: center;
color: black;
background-color: #626262;
background-repeat: repeat-x;
border: 1px solid black;
}
#pied_de_page a
{
color: #FFFFFF;
}
#pied_de_page a:hover
{
background-color: #313131;
color: #E0A200;
}
</style>
<div id="pied_de_page">
<table border="0" center>
<tr><td width=40%><img src="image/balthordu.jpg" alt="Webmaster Balthordu"></td>
<td width=20%><!--Copyright BM² 2007<br>Tous droits réservés--></td>
<td><img src="image/metatron.jpg" alt="Webdesigner Métatron"></td></tr>
</table>
<table border="0" center>
<tr><td width=20%><h5><a href="image/balthordubig.bmp">Webmaster</a></h5>
<td width=60%><h6>Copyright BM² 2007, Tous droits réservés</h6></td>
<td><h5<a href="image/metatronbig.jpg">Webdesigner</a></h5></td></tr>
</table>
<style>
#pied_de_page
{
float: right;
padding: 5px;
margin-top: 40px;
margin-right: 38px;
text-align: center;
color: black;
background-color: #626262;
background-repeat: repeat-x;
border: 1px solid black;
}
#pied_de_page a
{
color: #FFFFFF;
}
#pied_de_page a:hover
{
background-color: #313131;
color: #E0A200;
}
</style>
<div id="pied_de_page">
<table border="0" center>
<tr><td width=40%><img src="image/balthordu.jpg" alt="Webmaster Balthordu"></td>
<td width=20%><!--Copyright BM² 2007<br>Tous droits réservés--></td>
<td><img src="image/metatron.jpg" alt="Webdesigner Métatron"></td></tr>
</table>
<table border="0" center>
<tr><td width=20%><h5><a href="image/balthordubig.bmp">Webmaster</a></h5>
<td width=60%><h6>Copyright BM² 2007, Tous droits réservés</h6></td>
<td><h5<a href="image/metatronbig.jpg">Webdesigner</a></h5></td></tr>
</table>
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question