18041 sujets

Questions générales et questions de débutants

Looker un a

Bonjour, j'ai un code html dans lequel je voudrais looker un lien <a> sur le hover mais impossible de le faire Smiley decu Si je peux avoir un ptit coup de main je ne suis pas contre

sur cette page http://amalgame.ideacom.be/Default.aspx?tabid=219&language=en

j'ai affecté une classe survolorange sur les 4 textes en bas (pour construire vous avec le choix, Des differences qui vous avantages etc)

Ensuite j'ai fait en CSS :

#SurvolOrange a:Link{
	color: #ffffff;
	font:Tahoma, Century Gothic,Verdana, Helvetica, sans-serif;
	font-size: 11px;
	
}

#SurvolOrange a:Hover{
	color: #505153;
	font:Tahoma, Century Gothic,Verdana, Helvetica, sans-serif;
	font-size: 11px;
}

#SurvolOrange a:Active{
	color: #505153;
	font:Tahoma, Century Gothic,Verdana, Helvetica, sans-serif;
	font-size: 11px;
}

#SurvolOrange a:Visited{
	color: #505153;
	font:Tahoma, Century Gothic,Verdana, Helvetica, sans-serif;
	font-size: 11px;
}


Mais ça ne reagit pas au niveau de mon Ahref :s J'aurai oublié une leçon? :s

Merci pour votre aide Smiley smile

alex
Deux choses. L'une : une classe se cible avec "." et non "#" Smiley biggrin La deuxième, qui jouera peut-être une fois que tu auras réparé cette erreur, c'est que :hover, :active etc ne prennent pas de majuscules.

Oh, et pis une dernière, mais c'est plus de l'optimisation : tu peux factoriser ton code, et définir une taille et une police pour tes liens, et ensuite uniquement les couleurs pour chaque état des-dits liens.
Modifié par AkaiKen (25 Aug 2011 - 15:13)
en faisant le # je ne cible pas ma classe Css quel que soit son niveau ? car quand je met un . ca ne marche pas non plus Smiley decu
Modifié par korsonsky (25 Aug 2011 - 15:41)
korsonsky a écrit :
en faisant le # je ne cible pas ma classe Css quel que soit son niveau ? car quand je met un . ca ne marche pas non plus Smiley decu


La vache ! Non pas du tout... # est un sélecteur d'identifiant (id) !
Le sélecteur de classe est bien un "." comme l'a dit AkaiKen. A mon avis tu devrais relire quelques cours de CSS basiques, tu devrais trouver ton bonheur ici Smiley cligne

A bientôt
ok pour le # bon par contre si je met un code html

<div id="ZoneBasSurVolOrange">
<table cellspacing="10" cellpadding="10" style="width: 740px; height: 70px;">
    <thead>
    </thead>
    <tbody>
        <tr align="left">
            <td style="padding-left: 20px; border-style: none dotted none none; border-right: thin dotted #ffffff; width: 180px;"><a href="/logisstyle/fr-fr/nouschoisir/pourconstruirevousavezlechoix.aspx" target="_self" class="SurvolOrange">Pour construire <br />
            vous avez le choix !</a></td>
            <td style="padding-left: 25px; border-right: thin dotted #ffffff; width: 180px;"><a href="/logisstyle/fr-fr/nouschoisir/desdiff%C3%A9rencesquivousavantagent.aspx" target="_self" class="SurvolOrange">Des diff&eacute;rences <br />
            qui vous avantagent.</a></td>
            <td style="padding-left: 25px; border-right: thin dotted #ffffff; width: 180px;"><a href="/logisstyle/fr-fr/nouschoisir/unconstructeurquirassure.aspx" target="_self" class="SurvolOrange">Un constructeur <br />
            qui rassure.</a></td>
            <td style="padding-left: 25px; width: 180px;"><a href="/logisstyle/fr-fr/nouschoisir/lescoulisseslogisstyle.aspx" target="_self" class="SurvolOrange">L'entreprise <br />
            en image</a></td>
        </tr>
    </tbody>
</table>
</div>


ma css pour que lorsque l'on survole le lien soit orange est bien ? 


.SurvolOrange a:Link{
	color: #ffffff;
	font:Tahoma, Century Gothic,Verdana, Helvetica, sans-serif;
	font-size: 11px;
	
}

.SurvolOrange a:Hover{
	color: #505153;
	font:Tahoma, Century Gothic,Verdana, Helvetica, sans-serif;
	font-size: 11px;
}

.SurvolOrange a:Active{
	color: #505153;
	font:Tahoma, Century Gothic,Verdana, Helvetica, sans-serif;
	font-size: 11px;
}

.SurvolOrange a:Visited{
	color: #505153;
	font:Tahoma, Century Gothic,Verdana, Helvetica, sans-serif;
	font-size: 11px;
}


parce que c'est ce que j'ai fait et rien ne se passe quand je survole le texte :s
j'ai mis

a.SurvolOrange:link{
	color: #ffffff;
	font:Tahoma, Century Gothic,Verdana, Helvetica, sans-serif;
	font-size: 11px;
	
}

a.SurvolOrange:hover{
	color: #e36c09;!important;
	font:Tahoma, Century Gothic,Verdana, Helvetica, sans-serif;
	font-size: 11px;
}

a.SurvolOrange:active{
	color: #505153;
	font:Tahoma, Century Gothic,Verdana, Helvetica, sans-serif;
	font-size: 11px;
}

a.SurvolOrange:visited{
	color: #505153;
	font:Tahoma, Century Gothic,Verdana, Helvetica, sans-serif;
	font-size: 11px;
}


et ca ne marche tjs pas pour l'url http://amalgame.ideacom.be/Default.aspx?tabid=219&language=en
Modérateur
jmlapam, non, car ton code signifie : appliquer les styles sur tous les éléments avec la class survolorange qui se trouvent dans un élément <a> visité.
Sujet clos
Aller à