High-Tech Santé Médecine Droit-Finances

Grippe A

Que dois-je faire ?

Rechercher : dans
Par :

Liens css de couleurs différentes

Dernière réponse le 31 oct 2008 à 12:32:20 ducky, le 17 jan 2008 à 14:34:29 
 Signaler ce message aux modérateurs

Bonjour,

je voudrais savoir comment faire pour que dans une même page, la couleur des liens soit différente. quand je survole mon menu la couleur soit bleu, quand je survole mon sous menu ma couleur soit verte. J'ai fait un style css avec a:hover mais ca change pour toute la page.

merci

Configuration: Windows XP
Internet Explorer 7.0

Meilleures réponses pour « liens css de couleurs différentes » dans :
Enlever le soulignement sous les liens en HTML/CSS VoirPar défaut, les liens hypertextes en HTML sont soulignés, un trait de la couleur du lien apparaît en dessous du texte. Il est possible de supprimer ce soulignement à l'aide de la propriété CSS text-decoration:none : Grâce au CSS Grâce au CSS via...
CSS - Les couleurs VoirLes couleurs Le standard CSS propose différentes façons de définir des couleurs : par un nom avec la notation hexadécimale avec la notation décimale Appel d'une couleur par son nom Le langage HTML définit des noms pour un nombre limité de...
Les classes de style (CSS) VoirLes classes et les ID Les classes Il peut s'avérer intéressant d'affecter des styles différents à des mêmes balises. Pour cela les spécifications CSS ont introduit le concept de classe. La définition des classes est aussi simple que celles des...
Posez votre question Répondre

1

killermano66, le 17 jan 2008 à 14:41:39

Pour cela il faut que tu définisse une classe CSS, que tu lui donne un nom en quelques sorte. Je te met un exemple en dessous :

a:hover.couleur1 {
color:#9999ff;
}

et pour le déclarer dans ton lien tu met :
<a href="url_de_ta_page" style="couleur1">Lien 1</a>

Si j'avais appelé la classe couleur2, tu aurais mis style="couleur2" dans ton lien.

Voilà, en espérant t'avoir aidé.

   
Répondre à killermano66

2

Darkito, le 17 jan 2008 à 14:42:51

Bonjour,
si as créé une Div menu par exemple, tu peux spécifier #menu a:hover , idem avec #sousmenu a:hover
Cela te permet de personnaliser la balise a au sein d'une div particulière.
--
Tøƒ

   
Répondre à Darkito

3

ducky, le 17 jan 2008 à 15:03:05

Excusez-moi mais je n'ai pas tout compris si je vous envoie mon code ce sera eut-être plus simple. En fait j'ai fait mon menu et c'est "enjeux" et "notre process" à qui je voudrais mettre un autre css de survol. Quand je passe dessus le texte devient bleu, par exemple. Mais comment faire?



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title></title>
<style type="text/css">
@import url("corp.css");
@import url("titre page.css");




.tdover{
text-align: center;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: bold;
color: #FFFFFF;
text-decoration: none;
background-color: #00863E;

}

.tdout {
text-align: center;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: bold;
color: #FFFFFF;
text-decoration: none;
background-color: #0188FF;
}

.tdover a, .tdout a {
color: #FFFFFF;
font-weight: bold;
text-decoration: none;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
}

body {
background-color: #0188FF;
}
.Style1 {font-size: 9px}
.Style3 {
font-size: 9px;
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #0188FF;
font-weight: bold;
}
.Style4 {color: #00863e}
.Style5 {color: #00863E}
.Style14 {font-family: Verdana, Arial, Helvetica, sans-serif; color: #000000; font-size: 12px;}
.Style25 {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; font-weight: bold; color: #FFFFFF; }
</style>
</head>

<body>
<table width="760" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">

<tr>
<td colspan="6"><div align="center"></div></td>
</tr>

<tr>
<td colspan="6"><table width="760" cellspacing="0" height="4" border="0">

<tr>

<td width="168" class="tdout" onmouseover="this.className='tdover'" onmouseout="this.className='tdout'"><a href="qui sommes-nous.html">Qui sommes-nous </a></td>
<td width="138" class="tdout" onmouseover="this.className='tdover'" onmouseout="this.className='tdout'"><a href="null">Notre activité </a></td>
<td width="137" class="tdout" onmouseover="this.className='tdover'" onmouseout="this.className='tdout'"><a href="null">La qualité </a></td>
<td width="157" class="tdout" onmouseover="this.className='tdover'" onmouseout="this.className='tdout'"><a href="null">Notre démarche </a></td>
<td width="138" class="tdout" onmouseover="this.className='tdover'" onmouseout="this.className='tdout'"><a href="null">Nous contacter </a></td>
</tr></table></td>
</tr>

<tr>
<td width="201" bgcolor="#00863e"><p class="Style14"> </p></td>
<td width="136" bgcolor="#00863e" class="Style25">~ nos enjeux </td>
<td width="106" bgcolor="#00863e"><span class="Style25">~ notre process </span></td>
<td width="108" bgcolor="#00863e"> </td>
<td width="103" bgcolor="#00863e"> </td>
<td width="106" bgcolor="#00863e"> </td>
</tr>
</table>
</body>
</html>

   
Répondre à ducky

4

killermano66, le 17 jan 2008 à 15:09:10

Ben comme on te l'a expliqué, tu définis une autre classe CSS avec la couleur désirée pour les liens que tu veux.
Puis tu déclare la classe dans le lien.

<a href="null" class="le_nom_de_ta_classe">Notre démarche</a>

class="le_nom_de_ta_classe" => C'est cette portion de code qui te permet de déclarer la classe que tu as préalablement créer dans ton css ( entre les balises <style></style> )

   
Répondre à killermano66

5

ducky, le 17 jan 2008 à 16:31:42

Je n'y arrive toujours pas mais je vais persévérer. Je dois tout de même faire une classe même si c'est pour un rollover ?

   
Répondre à ducky

6

killermano66, le 17 jan 2008 à 17:57:29
  • +1

Ben si tu veux plusieur rollover différent oui. Il te faut créer une classe pour chacuns.

   
Répondre à killermano66

7

 Joe, le 31 oct 2008 à 12:32:20

A:hover.couleur1 {
color:#9999ff;
}

et pour le déclarer dans ton lien tu met :
<a href="url_de_ta_page" style="couleur1">Lien 1</a>

C'est class ="couleur1" qu'il fallait mettre évidement

   
Répondre à Joe
Posez votre question Répondre
Ils ont besoin de votre aide