Typographie

Les entêtes

Nous fournissons un style de base sur les balises d’en-tête. Dans cet exemple, vous pouvez voir les 6 tailles de balises d’en-tête.

Heading h1

Heading h2

Heading h3

Heading h4

Heading h5
Heading h6

Blockquotes

Les blockquotes sont principalement utilisés afin de donner de l’emphase à une citation. Vous pouvez également utiliser ces dernier afin de donner plus de hiérarchie à votre texte.

Ceci est un exemple de citation qui utilise la balise blockquote.
Voici une autre ligne pour le faire paraître plus grand.


    <blockquote>
      Les blockquotes sont principalement utilisés afin de donner de l'emphase à une citation.
    </blockquote>
          

Flow Text

L’un des défauts majeurs que nous avons identifiés dans la plupart des frameworks est l’absence de support réel pour le texte adaptatif. Alors que les éléments de la page se redimensionnent de manière fluide, le texte se redimensionne encore de façon fixe. Pour régler ce problème sur les pages à gros contenu textuel, nous avons créé une classe qui fluidifie le redimensionnement de la taille du texte ainsi que de l’interligne afin d’optimiser la lisibilité du contenu. La longueur de ligne reste entre 45-80 caractères et la hauteur de ligne s’adapte afin d’être plus large sur les petits écrans.

Pour voir le texte adaptatif en action, redimensionnez lentement votre navigateur et observer la taille du corps de texte changer ! Utilisez le bouton dessus afin d’activer et de désactiver le texte adaptatif afin de voir la différence !

Pour utiliser le flow-text sur un corps de texte, il suffit d’ajouter le flow-text à une classe de balise, voir le code ci-dessous.


    <p class="flow-text">Je suis un Flow Text</p>