Outils pour utilisateurs

Outils du site


cours:informatique:dev:web:simplifiez-vous-le-css-avec-sass:140_utiliser_sass

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentesRévision précédente
cours:informatique:dev:web:simplifiez-vous-le-css-avec-sass:140_utiliser_sass [2025/08/16 09:13] yoanncours:informatique:dev:web:simplifiez-vous-le-css-avec-sass:140_utiliser_sass [2025/08/16 10:18] (Version actuelle) yoann
Ligne 191: Ligne 191:
  
 Sélectionnez Sass ou SCSS, puis cliquez sur le bouton Save & Close en bas de la page. Sélectionnez Sass ou SCSS, puis cliquez sur le bouton Save & Close en bas de la page.
-Dans Pen Settings, le langage CSS est sélectionné. Dans CSS Preprocessor, SCSS est sélectionné dans le menu déroulant. L'option Neither est cochée dans Vendor Preffixing. Le bouton Save and Close est en surbrillance en bas de la page 
-Définir SCSS ou Sass comme préprocesseur sur Codepen 
-À vous de jouer ! 
  
-Depuis ce CodePen, reprenez votre barre de navigation du chapitre précédent, et passez votre code CSS en Sass !+{{config_codepen.png}}
  
-Vérifiez vos réponses avec la correction dans ce CodePen. +Définir SCSS ou Sass comme préprocesseur sur Codepen
-En résumé +
- +
-    Les préprocesseurs CSS vous permettent d’imbriquer votre code (on appelle ça le nesting) pour créer une hiérarchie plus facile à lire, et regrouper des morceaux de code entre eux. +
- +
-    Il existe plein de préprocesseurs, mais le plus courant est Sass+
- +
-    La syntaxe .scss  est très similaire à la syntaxe CSS.+
  
-    La syntaxe  .sass  est plus concise, mais .scss  reste plus couramment utilisée. 
  
-    On peut utiliser du code CSS préexistant dans Sass en l’intégrant dans un fichier .scss  .+===== En résumé =====
  
-    Le code Sass doit être compilé en CSS pour que les navigateurs puissent le lire et l’utiliser.       +  * Les préprocesseurs CSS vous permettent d’imbriquer votre code (on appelle ça le nesting) pour créer une hiérarchie plus facile à lire, et regrouper des morceaux de code entre eux. 
 +  * Il existe plein de préprocesseurs, mais le plus courant est Sass. 
 +  * La syntaxe ''.scss'' est très similaire à la syntaxe CSS. 
 +  * La syntaxe  ''.sass'' est plus concise, mais ''.scss'' reste plus couramment utilisée. 
 +  * On peut utiliser du code CSS préexistant dans Sass en l’intégrant dans un fichier ''.scss''
 +  * Le code Sass doit être compilé en CSS pour que les navigateurs puissent le lire et l’utiliser.       
  
 +Il est temps de faire un point et de revenir sur tout ce que vous avez appris avec le quiz de fin de section ! Je vous retrouve dans la partie suivante où nous utiliserons Sass pour optimiser votre code.
  
  
cours/informatique/dev/web/simplifiez-vous-le-css-avec-sass/140_utiliser_sass.1755335607.txt.gz · Dernière modification : 2025/08/16 09:13 de yoann