article(s) dans votre panier VOIR

Imbriquer du code pour programmer avec le préprocesseur CSS SASS

  • Vidéo 7 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
Imbrication de code
00:00 / 10:42
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 cette formation concernant le préprocesseur CSS, le formateur vous explique l’imbrication de code. Ce cours en ligne a pour objectif de découvrir les outils graphiques pour coder avec SASS à travers un exemple. Pour y parvenir, il faut savoir que Compass et SASS vous proposent des outils graphiques afin de faciliter votre codage. Vous avez les fonctions Saturate et Desaturate. Pour l’utiliser, vous créez tout d’abord un fichier HTML et vous liez ce dernier à un fichier CSS. En notant que ce dernier est une feuille de style CSS. Ce qui implique que cette feuille est générée par SASS. Afin de travailler les fonctions précédentes, il vous est nécessaire de créer une variable. Pour ce faire, vous créez une variable couleur_mi_ton tout en lui donnant une valeur. Après cela, vous revenez dans votre fichier HTML et vous divisez votre fenêtre en trois parties en utilisant Div. Vous passez ensuite dans votre feuille de style CSS et spécifiez un style CSS de base. Pour cela, vous utilisez l’instruction div {background : $couleur_mi_ton} ; qui correspond à la première partie. Cela fait, vous stylisez les deux parties qui restent. Vous avez alors div.nom_de_la_partie {background : saturate ($color, $amount)}. Color désigne la couleur à saturer. Tandis que Amount représente le pourcentage de saturation. Vous avez la même structure pour la fonction Desaturate. En notant bien qu’il faut remplacer Saturate par Desaturate. Pour conclure, vous pouvez remarquer que l’utilisation de ces outils permet de réduire la longueur du code.