Les bases du css

Syntaxe, notation fondamentales, padding, margin, width, height, background-color

Cosmétique en CSS

La propriété CSS font-family et les Google Fonts
Les autres propriétés CSS liées à la police
Les propriétés CSS liées au texte
Gérer la taille des interlignes et des espaces dans les textes en CSS
Gérer la couleur et l’opacité des textes

L’ élément Table HTML

Créer des tableaux en HTML
Structurer un tableau HTML
Mettre en forme un tableau HTML avec du CSS

Fond, dégradés et ombres css

Gérer la couleur de fond des éléments HTML
Ajouter des images en fond des éléments HTML
Création de dégradés linéaires en CSS
Création de dégradés radiaux en CSS
Ajouter des ombres aux éléments en CSS

Selecteurs css avancés

Les sélecteurs CSS d’attributs, pseudo-classes CSS et pseudo-éléments CSS

Le layouting en CSS

Les flexbox à la rescousse

Le flexbox implique un contenant et un contenu

Utilisation d’un configurateur en ligne de flexbox pour apprendre facilement le Fllexbox

Les box model

Influence sur la padding et margin
Gestion des bordures en CSS
Gestion des marges externes (margin) en CSS
La propriété CSS box-sizing

Transitions, animations et transformations css

Créer des transitions en CSS
Créer des animations en CSS
Créer des transformations en CSS

Les CSS Grid

Introduction au modèle des grilles CSS
Créer une grille et définir des pistes de grille
Servez vous d’un générateur de grid pour apprendre sa syntaxe
EXERCICE – Création d’une page à 3 colonnes contenant des éléments flexibles

Responsive design css

La balise meta viewport
La base du responsive : les media queries
Images responsive
EXERCICE – Création d’un menu déroulant responsive HTML et CSS
Comment rendre les tableaux responsifs

Projet HTML5/CSS

Vous aurez à réaliser un site web responsive design, avec un effet CSS animation à partir d’une maquette photo.