Chapitre 11 : SASS Personnalisation
1. Pourquoi SASS ?
SASS permet d'aller plus loin que les classes par défaut en modifiant les variables sources de Bootstrap (couleurs, polices, espacements).
2. Configuration
Créez un fichier custom.scss :
// 1. Modifier les variables
$primary: #ff5733;
// 2. Importer Bootstrap
@import "node_modules/bootstrap/scss/bootstrap";
3. Compilation
Utilisez un outil comme Vite ou un compilateur SASS pour transformer ce fichier en un fichier CSS utilisable par le navigateur.
Conclusion
La personnalisation permet de rendre votre site unique. Prochaine étape : Responsive Design avancé.
Objectifs du chapitre
- Comprendre les concepts clés de Personnalisation avec SASS.
- Savoir appliquer ces concepts sur un cas concret.
- Éviter les erreurs fréquentes et adopter les bonnes pratiques.
Explication
Ce chapitre vous guide pas à pas sur le thème Personnalisation avec SASS. L'idée est de partir d'une approche simple, puis de progresser vers des usages plus réalistes.
Exemple pratique
Essayez d'appliquer la notion vue ici dans un mini-exemple de votre projet personnel. Ensuite, comparez votre résultat avec les exercices associés pour valider votre compréhension.
À retenir
Maîtriser Personnalisation avec SASS vous permettra d'aller plus vite dans les chapitres suivants.
Ateliers pratiques & Projets
Testez vos compétences avec nos exercices guidés et le tuteur IA.
Ateliers pratiques & Corrigés détaillés
Ateliers pratiques & Corrigés
#1 — Comprendre les bases : Personnalisation avec SASS
Atelier #1Expliquez avec vos mots le concept principal de ce chapitre, puis illustrez-le par un exemple simple.
Consulter la solution type du formateur
#2 — Application guidée
Atelier #2Réalisez un exercice pratique en reprenant la structure vue dans le cours et en modifiant au moins 2 paramètres.
Consulter la solution type du formateur
#3 — Mini défi
Atelier #3Concevez une petite solution personnelle liée à 'Personnalisation avec SASS' et justifiez vos choix techniques.