M2i Formation

Créer des CSS dynamiques avec SASS et Compass

Par M2i Formation

Objectifs

  • Optimiser la gestion des styles CSS
  • Comprendre la syntaxe de SASS et de Compass
  • Maîtriser la compilation et la création des fichiers CSS
  • Déployer une stratégie de maintenance et de réutilisabilité.

Programme

Introduction

  • Principes
  • Server-side
  • SASS et SCSS : compatibilité
  • Les frameworks : Compass, Bourbon, Suzy...
  • Le Framework Compass
  • Comparaison avec LESS

Installation du préprocesseur

  • Environnements de compilation
  • Installation de Prepros
  • Paramétrages
  • Compilation d'un fichier SASS en feuille de styles CSS

Principes

  • Découpage du projet
  • @import et fichiers multiples
  • Factorisation
  • Réutilisabilité
  • Optimisation, compression et minification

Syntaxe de SASS

  • DRY (Don't Repeat Yourself)
  • Imbriquer les sélecteurs
  • Les variables
  • Mixin et fonctions

Booster la factorisation

  • Extension des sélecteurs : @extend
  • Placeholders
  • Maps et convention de nom

Les sprites

  • Définition
  • Paramétrer une sprite map
  • Images en base64
  • Utilisation d'inline

Maintenir un projet SASS

  • Débogage
  • Source Maps et navigateurs

Pédagogie

L'évaluation des acquis se fait :

  • En cours de formation, par des productions
  • Et, en fin de formation, par un questionnaire d'auto-évaluation ou une certification (M2i ou éditeur)

Partager cette formationTélécharger au format pdf Ajouter à mes favoris

Formations de la même catégories (5)

Open Source School Executive Education
CSS 2 et 3 : des bases à la maîtrisePar Open Source School Executive Education

Maîtriser les bases du HTML5
Exploiter les ressources des CSS
Créer des pages web de qualité

Data Value
CSS3Par Data Value

Maîtriser le langage CSS3 pour présenter les contenus Web de façon optimisée et adaptative.

M2i Formation
Less et Sass - Rentabiliser vos développements CSSPar M2i Formation
  • Utiliser les préprocesseurs Less et Sass dans le cadre d'applications graphiques
  • Combler les lacunes de CSS (exemple : absence de variables ou de fonctions) avec Less et Sass
  • Rendre le résultat des développements réutilisable.
Demos
Développement Web : Maîtrise des bases (HTML5, CSS3 et JavaScript) - NExT Digital coachéPar Demos
  • connaître les concepts et les langages associés à la création de pages web
  • comprendre et corriger un code conforme aux normes en vigueurs
  • savoir mettre à jour le contenu d'un site web existant
Pyramyd Formation
CSS3 : les fondamentauxPar Pyramyd Formation

CERTIFICATION ENI

La certification valide des compétences et se présente sous la forme d’un questionnaire à choix multiple adaptatif avec plusieurs niveaux de questions.

Nous utilisons les cookies afin de fournir les services et fonctionnalités proposés sur notre site et afin d’améliorer l’expérience de nos utilisateurs. En cliquant sur ”J’ai compris”, vous acceptez l’utilisation de ces cookies.