Texte clignotant Bouton_activeTexte clignotant Bouton_hoverTexte clignotant Fb-hoverTexte clignotant Fb-active
CSSActif, le forum, n'est plus maintenu. Il est néanmoins disponible pour consultation. Pour des outils pratiques, rendez-vous sur:

Découvrez CSSActif, une collection d'outils et de tutoriels interactifs pour les développeurs Web — HTML, CSS, JavaScript et bien plus!

Derniers sujets
» Fiche de Présentation RPG
Texte clignotant EmptySam 30 Mar 2024, 22:07 par Peyton972

» [RPG] Fiche personnage avec bannière
Texte clignotant EmptySam 30 Mar 2024, 22:06 par Peyton972

» Structure de Qui Est En Ligne (1)
Texte clignotant EmptyLun 04 Mar 2024, 23:20 par Peyton972

» Qui Est En Ligne - Utopia
Texte clignotant EmptyDim 24 Déc 2023, 18:16 par romee

» Pack forum complet "Androïd Sylver" RPU (N°2)
Texte clignotant EmptyJeu 02 Nov 2023, 06:42 par Hydrar

» Formulaire de connexion rapide amélioré
Texte clignotant EmptySam 04 Mar 2023, 18:57 par Krager

» Avatar centré dans le profil
Texte clignotant EmptySam 11 Fév 2023, 06:04 par Krager

» Vos partenaires dans le footer
Texte clignotant EmptyMar 07 Fév 2023, 08:40 par Oxtran

Le Deal du moment : -39%
Ordinateur portable ASUS Chromebook Vibe CX34 Flip
Voir le deal
399 €

Partagez
 

Texte clignotant

Voir le sujet précédent Voir le sujet suivant Aller en bas 
Teal
Invité




Texte clignotant Empty

Texte clignotant


Informations générales

Description :
Aujourd'hui, nous allons apprendre comment faire clignoter un texte. La plupart du temps cette propriété sert à mettre en valeur une partie du texte.

Démo :
Ce texte doit clignoter

Testé sur :
Firefox

Crédits :
Proposé par Teal le 13/11/2010 | Validé par Espéon

Mise(s) à jour :
Mise à jour le 27/07/2012 par Espeon

Le tutoriel


Cet effet ne fonctionne que sous Firefox. S'il peut être sympathique, n'oubliez pas que son impact est donc limité et ne permettra que d'agrémenter un peu la navigation de ceux qui utilisent ce navigateur.


Le HTML


Commençons par créer une classe, que nous appellerons ici texteClignotant, qui nous permettra d'appliquer cet effet au texte qui se trouve à l'intérieur de la balise.

Nous prenons l'exemple ici avec une balise de paragraphe <p>, mais libre à vous de l'adapter plus généralement avec une balise <div> par exemple :

Code:
<p class="texteClignotant">Votre Texte</p>

Le CSS


Voilà ! Maintenant passons au CSS.

Si je veux appliquer mon effet à tous les paragraphes qui portent cette classe, alors je fais comme ceci:
Code:
p.texteClignotant {
    text-decoration: blink;
}

Pour l'appliquer plus généralement à toute balise qui porterait la classe texteClignotant (sans chercher à savoir s'il s'agit d'une div, d'un span ou d'un paragraphe), je fais comme ceci :
Code:
.texteClignotant {
    text-decoration: blink;
}

Pour aller plus loin


Si je le veux, je peux rendre simplement une partie de mon texte clignotant si j'imagine le code HTML suivant :
Code:
<p>Ceci est un paragraphe et <span class="texteClignotant">cette partie clignote</span></p>

Si vous êtes fondateur de votre forum, rendez-vous dans votre Panneau d'Administration > Affichage > Couleurs > Feuilles de style pour y déposer le CSS.
Sinon, vous pouvez toujours inclure le CSS dans le HTML, à condition que celui-ci soit activé, de la manière suivante :
Code:
<p style="text-decoration:blink;">Texte Clignotant</p>

Nous avons enfin terminé !
MessageSujet: Texte clignotant   Texte clignotant EmptySam 13 Nov 2010, 17:56
Revenir en haut Aller en bas
http://www.i-love-harvard.com/
Kaiji
Kaiji
Blanche-Neige
Blanche-Neige

Féminin Messages : 5578



Texte clignotant Empty
FAQ


Q
//

R
//


Pour toute question sur ce tutoriel, merci de poster une demande d'aide ici :
http://www.css-actif.com/f17-aide-css-xhtml
MessageSujet: Re: Texte clignotant   Texte clignotant EmptyMer 03 Aoû 2011, 09:11
Revenir en haut Aller en bas
Espeon
Espeon
Administrateur
Administrateur

Masculin Messages : 1819



Texte clignotant Empty
27-07-2012 : Tutoriel revu et mis à jour
MessageSujet: Re: Texte clignotant   Texte clignotant EmptyVen 27 Juil 2012, 20:31
Revenir en haut Aller en bas
Contenu sponsorisé




Texte clignotant Empty
MessageSujet: Re: Texte clignotant   Texte clignotant Empty
Revenir en haut Aller en bas
 

Texte clignotant

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1

 Sujets similaires

-
» Texte clignotant
» Texte clignotant
» Texte clignotant (messages)
» Problème texte qui passe sur un autre texte
» problème de texte

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
CSSActif :: Tutoriels de CSSActif :: ForumActif Pas à pas :: Les Messages-

Partenaires Or


← Page précédente   ↑ Aller en haut Copyright © CSSActif 2009 - 2013 Tous droits réservés
Créer un forum | ©phpBB | Forum gratuit d'entraide | Signaler un abus | Forumactif.com