Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Apprendre Variables Sass | Préprocesseurs
Techniques CSS Avancées
course content

Contenu du cours

Techniques CSS Avancées

Techniques CSS Avancées

1. Introduction
2. Positionnement des Éléments
3. Transitions
4. Animations
5. Transformations
6. Sites Web et Applications Adaptatifs/Réactifs
7. Préprocesseurs

book
Variables Sass

La première fonctionnalité utile est l'existence des variables. Nous pouvons stocker et réutiliser des valeurs dans le code. C'est très similaire au langage de programmation qui permet de créer une variable une fois et de l'utiliser plusieurs fois. Pour déclarer une variable, nous devons mettre un signe dollar () et un nom de variable, puis nous mettons un deux-points (:`) et donnons une valeur.

Remarque

Nous pouvons utiliser n'importe quelle notation de nommage, qu'il s'agisse du kebab case (text-primary-color), du snake case (text_primary_color), ou du camel case (textPrimaryColor). Ce qui est essentiel, c'est d'utiliser la même notation de nommage tout au long du projet.

Imaginons que nous devons créer un balisage dans lequel nous avons toute la couleur du texte en #474943 et sa taille de police en 24px. Le fichier sass ressemblerait à ceci :

Nous gardons toujours les variables aussi descriptives que possible, afin de garantir ce dont chaque variable est responsable.

L'avantage est que cela facilite les modifications de conception du projet ultérieurement. Si la taille de la police ou la couleur du texte change, nous pouvons mettre à jour la valeur des variables $textColor et $textFontSize, et le projet sera également modifié.

Avec l'aide de quel signe déclarons-nous une variable sass ?

Avec l'aide de quel signe déclarons-nous une variable sass ?

Sélectionnez la réponse correcte

Tout était clair ?

Comment pouvons-nous l'améliorer ?

Merci pour vos commentaires !

Section 7. Chapitre 3
We're sorry to hear that something went wrong. What happened?
some-alt