article(s) dans votre panier VOIR

Apprendre la grille de ligne de base du framework Compass avec le préprocesseur CSS SASS

  • Vidéo 12 sur 14
  • 1h33 de formation
  • 14 leçons

Un contenu flash devrait s'afficher ici. Votre navigateur ne comporte pas de plugin flash, ou il ne s'est pas correctement initialisé.

Vous pouvez télécharger le plugin flash depuis le site d'Adobe à l'adresse suivante : http://get.adobe.com/flashplayer/.

Pour accéder à la suite de cette formation, vous devez vous abonner.
previous
summary
resume
next
play
La grille de ligne de base chez Compass
00:00 / 11:39
HD
fullscreen
Je m’abonne
à partir de 16,6 € / mois
  • Visionnage en ligne
  • Accès illimité à toutes nos formations
OU
J'achète uniquement
la formation
24,90€
  • Téléchargement + VOD à vie
  • Accès uniquement à cette formation

Détails de la formation

Dans ce cours vidéo concernant le préprocesseur CSS SASS, l’auteur vous explique la grille de ligne de base chez Compass. L’objectif de ce cours en ligne consiste à savoir les possibilités graphiques dans Compass. La bibliothèque Compass dispose d’une série de possibilité graphique. La série indispensable est le rythme vertical, il consiste à arranger l’espacement du texte au fur et à mesure que le lecteur descend dans la page. Vous pouvez arranger ce rythme vertical en combinant trois facteurs. Il s’agit de la hauteur de ligne, la taille de votre police ainsi que la marge et la marge de remplissage. Pour appliquer cela, vous créez tout d’abord un nouveau fichier. Dans ce fichier, vous créez deux variables, elles correspondent à la taille de base de police et l’interligne type. En n’oubliant de donner des valeurs à ces deux variables. Si vous souhaitez utiliser des REM, vous utilisez le code $rythm-unit : « rem ». Vous indiquez ensuite les tailles des différents titres de votre page. Pour intégrer la mécanique de Compass dans votre programme, vous avez besoin d’un mixin. Pour cela, vous avez @include establish-baseline, cette écriture vous aide à créer une ligne de base. Pour régler les grilles de ligne de base en fonction des tailles des différents titres, vous faites appel à un autre Mixin. Il s’agit de @include adjust-font-size-to (variable). En notant bien que le mot variable est remplacé par la fonction représentant la taille des titres. Pour conclure, vous pouvez dorénavant utiliser la méthode rythme vertical pour arranger l’espacement de votre texte.