Prototypage avancé avec SASS

Etendre des éléments de base
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Maîtrisez le préprocesseur CSS : SASS
Revoir le teaser Je m'abonne
5,0
Transcription

34,90€ Je commande

Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

DescriptionProgrammeAvis
5,0
34,90€ Je commande

Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

Les objectifs de cette vidéo sont d'apprendre à utiliser la méthode extend de SASS pour le prototypage rapide et d'optimiser le code CSS.

Apprenez les techniques efficaces de prototypage avec SASS, en utilisant la méthode extend pour optimiser votre code CSS.

Dans cette leçon, nous explorons les capacités de prototypage offertes par SASS, en mettant l'accent sur l'utilisation de la méthode extend. Nous commençons par créer un nouveau fichier partiel appelé footer.scss dans notre projet. Dans le fichier index.html, nous ajoutons un footer contenant plusieurs div, chacune ayant une classe distincte.

Ensuite, nous définissons des styles arbitraires pour la première div avec des valeurs telles que la largeur, la hauteur et une couleur de fond. Nous appliquons ensuite la méthode extend aux autres div pour partager ces styles communs tout en permettant la personnalisation de certaines propriétés comme la couleur de fond.

Enfin, nous expliquons comment inclure ce fichier partiel dans le fichier principal screen.scss et vérifier les résultats dans le navigateur. Cette méthode démontre comment SASS peut rationaliser le processus de codage et améliorer l'efficacité du travail de développement.

Voir plus
Questions réponses
Quel est l'avantage principal de la méthode extend en SASS ?
L'avantage principal de la méthode extend en SASS est qu'elle permet de réutiliser des styles communs dans plusieurs sélecteurs sans dupliquer le code, ce qui optimise et simplifie la maintenance du CSS.
Comment nommer un fichier partiel en SASS ?
Pour nommer un fichier partiel en SASS, il faut ajouter un underscore (_) devant le nom du fichier, par exemple _footer.scss.
Quels types de styles peuvent être étendus avec la méthode extend ?
Avec la méthode extend, on peut étendre des styles comprenant des propriétés de mise en forme comme la largeur, la hauteur, la couleur de fond, et bien d'autres propriétés CSS.
1 commentaire
5,0
1 vote
5
4
3
2
1
hugo.barnas
Il y a 4 ans
Claire et complet.