Voici la liste des styles, ou classes, que vous pouvez utiliser pour enrichir votre texte.
Voici un exemple d'utilisation pour ces classes:
<p class="Ma_Classe">mon texte</p>
Les titres
Nous avons prévu que les balises H1, h2 et h3 aient un aspect spécifique au départ. Voici quelques variantes que vous pouvez associer:
Titre de niveau 1 (h1)
Titre de niveau 1 (h1) avec flèche: <h1 class="fleche">...</h1>
Titre de niveau 1 (h1) avec flèche_noire: <h1 class="fleche_Noire">...</h1>
Titre de niveau 2 (h2)
Titre de niveau 2 (h2) avec flèche: <h2 class="fleche">...</h2>
Titre de niveau 2 (h2) avec flèche_noire: <h2 class="fleche_Noire">...</h2> **
Titre de niveau 3 (h3)
Titre de niveau 3 (h3) avec flèche: <h3 class="fleche">...</h3>
Titre de niveau 3 (h3) avec flèche_noire: <h3 class="fleche_Noire">...</h3> **
<p>... <b>ARCAD<span class="txt_Bleu">E</span></b>... </p> Cela donnera: ARCADE
gauche ou left / droite ou right
Fait flotter un élément à gauche (ou à droite) et libère l'espace qu'il occupait. Ceci sera utile pour afficher un texte à gauche et une image à droite par exemple.
<img src="/images/mon_image.jpg" class=droite" />
<p class="">mon texte............... très long.</p>
Observez que l'élément qui flottera à droite doit être placé avant celui qui restera à gauche.
txt_bleu ou txt_Noir
Changera la couleur de votre texte en respectant la charte graphique du site.
en_savoir_plus
Cette classe doit être associée à un élément de type lien et donnera l'aspect d'un bouton similaire à "en savoir plus"
<a href="/mon_lien" class="en_savoir_plus" >Le texte du lien</a>
Ceci est un texte H1 simple
Titre H1 avec class="fleche"
Titre H1 class="fleche_Noire"
Ceci est un texte H2
Titre H2 avec class="fleche"
Titre H2 class="fleche_Noire" - <h2 class="fleche_Noire">Titre H2 class="fleche_Noire"</h2>
Ceci est un texte H3
Ceci est un Titre H3 avec class="fleche"
Ceci est un Titre H3 avec class="fleche_Noire"
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed molestie scelerisque ultrices. Nullam venenatis, felis ut accumsan vestibulum, diam leo congue nisl, eget luctus sapien libero eget urna.
Paragraphe avec class="txt_bleu" ...Felis ut accumsan vestibulum, diam leo congue nisl, eget luctus sapien libero eget urna.
ARCADE Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed molestie scelerisque ultrices. Nullam venenatis, felis ut accumsan vestibulum, diam leo congue nisl, eget luctus sapien libero eget urna.
Ici on souhaite ajouter une flèche devant le texte:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed molestie scelerisque u. Pour cela on utilise le code:
mon texte.....
