Sass (ou le css compilé)

Sass (ou le css compilé)

Lors de gros projets web, nous avons beaucoup de fichiers css. Le SASS est une alternative, un moyen pour « simplifier » notre css, pour n’avoir a coder qu’une seule fois.

Techniquement, a quoi ça sert ?

le sass est un langage de programmation basé sur le css. Avec sass, vous pouvez créer autant de feuilles de style que vous le voudrez. Toutes ces pages seront ensuite compilée par la suite pour générer un seul et unique fichier CSS (gain de temps).

SASS offre des options que le CSS seul ne propose pas :

  • Variables : avec SASS, les informations peuvent être stockées dans des variables pour être réutilisées ultérieurement. Par exemple, il est possible de stocker centralement une valeur de couleur sous une variable plus pratique (ici dans l’image :$red-color).
  • Fonctions mathématiques : avec SASS, vous pouvez également utiliser des opérateurs mathématiques tels que +*/ ou %. Ceci vous permet d’influencer les spécifications de taille, par exemple.
  • Fonctions : d’autres fonctions facilitent également le travail de conception. Elles peuvent être utilisées, par exemple, pour corriger les valeurs de couleur ou analyser des listes.
  • Boucles : un autre avantage de SASS est que vous pouvez utiliser des boucles. Ces boucles sont répétées jusqu’à ce qu’un statut que vous avez défini soit atteint.
  • Distinctions de cas : les énoncés conditionnels, si et dans le cas contraire, fonctionnent de la même façon. Ce n’est que lorsque certains états se produisent que les commandes spécifiées sont exécutées.
  • Mixins : les mixins sont des modèles. Vous pouvez soit les créer vous-même, soit simplement les intégrer dans votre code lorsque vous utilisez un framework.
  • Empreintes : le SASS original (contrairement au SCSS) fonctionne avec des indentations et des sauts de ligne pour structurer le code. Il n’y a pas de marqueurs sous forme de parenthèses nécessaires pour afficher l’imbrication, ni de points-virgules pour marquer les fins de ligne.
  • Nidification : CSS ne permet pas de travailler avec l’imbrication dans le code. SASS, d’autre part, donne à l’utilisateur la possibilité de visualiser les dépendances, réduisant la redondance et l’effort d’écriture.
  • Héritage : il est possible d’hériter des propriétés d’un sélecteur à l’autre. Cela permet également d’économiser de la paperasse et d’amincir le code.
  • Fichiers partiels : pour intégrer des codets dans un fichier SASS, vous pouvez également utiliser des fichiers partiels. Ce sont des fichiers dans lesquels seules quelques lignes CSS doivent être contenues et qui sont importés dans un fichier SASS par commande.

Et comment ça marche ?

Le Sass est un langage de programmation a part entiere, on le code dans un fichier .sass et, afin d’obtenir du CSS traditionnel, il faut les compiler.

D’après moi, le sass est utile dans de gros projets avec plein de pages html différentes, mais nous complique plutôt la tache sur des petits projets. C’est un outil génial tout de même


Rémi Duban

0
0

Laisser un commentaire