"surlignage" en survol sur un texte

Fermé
diddi776 - Modifié par diddi776 le 8/11/2011 à 12:10
Mihawk Messages postés 4315 Date d'inscription mercredi 29 mars 2006 Statut Contributeur Dernière intervention 6 janvier 2015 - 9 nov. 2011 à 10:17
Bonjour,

Je souhaiterais savoir, comment faire pour surligné au survol un texte avec la couleur qu'on veut, comme sur le site "http://cuisine.journaldesfemmes.com" ?

5 réponses

Bonjour,

Il s'agit d'une propriété CSS.
Tu encadres le texte à colorer au survol dans une balise.

Par exemple :
<span class="test">Voici un texte à colorer au survol !</span>

Puis, dans le CSS :
.test:hover   
{   
font-color:red;   
}

Le :hover indique que l'action ne sera réalisée qu'au survol de tout ce qui a la classe "test".
J'espère t'avoir répondu, mes notions de CSS commencent à dater...
Mourir nuit gravement à votre santé.
0
merci pour vos réponses,

Pour être plus précis, je cherche à ce que chaque caractères de mon site soit surligné en une autre couleur, par exemple comme sur le site que j'ai donné (http://cuisine.journaldesfemmes.com) c'est "surligné" en rose.

Alors je sais pas si je peut utiliser en css : text-decoration et mettre overline du type :

.test{
text-decoration:overline;
}


pour commencer
0
radgeur Messages postés 201 Date d'inscription samedi 25 septembre 2010 Statut Membre Dernière intervention 20 juin 2012 27
9 nov. 2011 à 09:46
A ce moment la, il suffit de faire la balise pour chaque lettre, avec le code CSS qui convient.
0
Mihawk Messages postés 4315 Date d'inscription mercredi 29 mars 2006 Statut Contributeur Dernière intervention 6 janvier 2015 846
9 nov. 2011 à 10:17
Peux-tu dire à quel niveau du site du vois ça stp ?
0
Un simple recherche google et le tour est joué :

*::selection {
	background:#cc2a00;
	color:#fff;
}

*::-moz-selection {
	background:#cc2a00;
	color:#fff;
}

*::-webkit-selection {
	background:#cc2a00;
	color:#fff;
}
0
radgeur Messages postés 201 Date d'inscription samedi 25 septembre 2010 Statut Membre Dernière intervention 20 juin 2012 27
8 nov. 2011 à 12:13
Bonjour,
Pour cela il faut mettre un évènement dans ton code.
-1
radgeur Messages postés 201 Date d'inscription samedi 25 septembre 2010 Statut Membre Dernière intervention 20 juin 2012 27
8 nov. 2011 à 14:07
où tout simplement on utilise du code php ^^.
0
Mihawk Messages postés 4315 Date d'inscription mercredi 29 mars 2006 Statut Contributeur Dernière intervention 6 janvier 2015 846
8 nov. 2011 à 14:11
Beurk c'est moche et lourd : le CSS fait très bien tout ça !
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Mihawk Messages postés 4315 Date d'inscription mercredi 29 mars 2006 Statut Contributeur Dernière intervention 6 janvier 2015 846
8 nov. 2011 à 13:24
Salut,

Malheureusement il n'y a pas de propriété CSS permettant de "surligner" à proprement parler. Il faut insérer le texte à surligner dans un "span" auquel tu donnera une couleur de fond lors du survol, via l'utilisation de la pseudo-classe CSS "hover".

Voici un exemple de code à copier sur ton ordinateur, dans un fichier HTML basique. Il te montre l'utilisation du CSS combiné au HTML pour surligner un mot lors du survol de la souris.

<html>
  <head>
    <style>
      .surligneJaune:hover {background-color:yellow;}
    </style>
  </head>
  <body>
    <div>
      Voici un texte servant de test, et le mot suivant est surligné au survol : <span class="surligneJaune">dromadaire</span>.
    </div>
  </body>
</html>
-1
radgeur Messages postés 201 Date d'inscription samedi 25 septembre 2010 Statut Membre Dernière intervention 20 juin 2012 27
8 nov. 2011 à 14:17
Oui mais à ce moment là le CSS tu le met dans un autre fichier.
0
Mihawk Messages postés 4315 Date d'inscription mercredi 29 mars 2006 Statut Contributeur Dernière intervention 6 janvier 2015 846
8 nov. 2011 à 14:19
Ca dépend s'il n'y a qu'une ligne autant le mettre là. Et surtout comment veux-tu que je poste deux fichiers sur le forum ?
Ah les rancuniers du -1 ça me sidère.
0
radgeur Messages postés 201 Date d'inscription samedi 25 septembre 2010 Statut Membre Dernière intervention 20 juin 2012 27
8 nov. 2011 à 14:24
Oui mais ca tu ne peut pas le savoir si il n'y en as qu'une, il faudrait que l'auteur du post participe un peu pour nous en dire un peu plus sur ce qu'il souhaite. Pour poster deux fichiers, tu peux le détaillé dans ta réponse.
Et que veux tu il y a des gens comme ca on y peux rien.
0
Mihawk Messages postés 4315 Date d'inscription mercredi 29 mars 2006 Statut Contributeur Dernière intervention 6 janvier 2015 846
8 nov. 2011 à 14:27
Il faudrait déjà que le posteur revienne :)
0
radgeur Messages postés 201 Date d'inscription samedi 25 septembre 2010 Statut Membre Dernière intervention 20 juin 2012 27
8 nov. 2011 à 14:29
C'est pas faux ^^!
0