Mettre une couleur sur un texte
Résolu
Profil bloqué
-
Profil bloqué -
Profil bloqué -
Bonjour,
j'apprends le XHTML/CSS et je voudrait savoir comment faire pour mettre une couleur sur un texte quand le curseur de la sourie passe dessus, sans utilisé les balise:
Je ne sais pas si on peut faire comme ca :
Et voici le CSS que je voudrais :
--
.: itsuki power shunyuu ! :.
j'apprends le XHTML/CSS et je voudrait savoir comment faire pour mettre une couleur sur un texte quand le curseur de la sourie passe dessus, sans utilisé les balise:
<span class="........" >/span>.
Je ne sais pas si on peut faire comme ca :
<p class="histoire"> mon texte.....</p>
Et voici le CSS que je voudrais :
.histoire:hover
{
color: #2e60c0;
}
--
.: itsuki power shunyuu ! :.
Configuration: Windows Vista Firefox 3.5.5
10 réponses
-
Salut !
C'est exactement ça. Lorsque ta souris passera au dessus du "p" de classe "histoire", il sera de la couleur 2e60c0 (un peu bleu-vert). -
Tu peux utiliser une classe sur n'importe quel élément : tu peux même mettre <strong class="histoire">Texte</strong> si tu veux rajouter l'effet hover en plus du gras.
Quand tu as des questions ainsi, le plus simple est d'expérimenter. -
ha, ca marche, mais sur un autre ca ne marche pas O_o :
XHTML:<p class="interieur_sommaire"> <li>episodes ddl </li> <li> japan Expo</li> <li> et les dramas japonais</li> </ul></p><br />
Et le CSS :.interieur_sommaire:hover { color: #261b74; text-decoration: underline; }
Ca ne marche pas... -
Tu devrais plutôt faire comme ça :
<ul> ... <li class="interieur_sommaire">episodes ddl </li> <li class="interieur_sommaire">japan Expo</li> <li class="interieur_sommaire">et les dramas japonais</li> </ul> <br />
C'est plus long mais je trouve que c'est plus propre. -
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question -
C'est plus court si on met le CSS sur le LI.
XHTML:
<p class="interieur_sommaire"> <li>episodes ddl </li> <li>japan Expo</li> <li> et les dramas japonais</li> </ul> </p>
Et le CSS :
.interieur_sommaire li:hover { color: #261b74; text-decoration: underline; }
PS : le <br/> à la fin… Faut le mettre dans le <p> (un élément de type "en ligne" doit se trouver dans un type "bloc". -
Sauf que ...
Le code complet devrait ressembler à ça :<ul> ... <p class="interieur_sommaire"> <li>episodes ddl </li> <li>japan Expo</li> <li> et les dramas japonais</li> </ul> </p>Tu ne remarques pas quelque-chose ? -
mouais, c'est pas faux… Le <p> dans le <ul> ça le fait pas, mais le <p> et le <ul> sont croisés (depuis le début même).
Et le "class" sur le <ul> (ce que je voulais dire en fait) ?
De toute façon, mettre un <ul> dans un <p>, génère une erreur pour le validation W3C…
<ul class="interieur_sommaire"> <li>episodes ddl </li> <li>japan Expo</li> <li> et les dramas japonais</li> </ul> -
Ou si il y a d'autres éléments dans la liste qui ne doivent pas avoir le style :
<ul> <li>Sans le style</li> <li class="interieur_sommaire">episodes ddl </li> <li class="interieur_sommaire">japan Expo</li> <li class="interieur_sommaire">et les dramas japonais</li> </ul>
-
Exact…
Mais en css c'est possible :
Avec un seul <li> au début que l'on ne décor pas, je mettrais :.interieur_sommaire li+li:hover { color: #261b74; text-decoration: underline; }
Mais bon… Si les <li> décorés et non-décorés se mélangent, ça devient compliqué^^. Mettre une classe sur chaque <li> est alors ce qu'il faut.
(pourquoi faire simple quand on peut faire compliqué^^) -
