Apprendre CSS - Cours Code

Apprenez le CSS étape par étape, de votre premier sélecteur aux mises en page responsives, aux animations et au design web moderne. Saisissez une ligne de CSS et regardez la page changer sur votre téléphone : l’éditeur affiche votre HTML et votre CSS côte à côte avec un aperçu en direct.

Ce tutoriel CSS est conçu pour les débutants et évolue avec vous. Chaque cours porte sur un sujet concret, chaque leçon est courte et l’éditeur est toujours accessible en un geste, pour pratiquer ce que vous venez de lire au lieu de vous contenter d’en apprendre la théorie.

CE QUE L’APPLICATION PROPOSE

• 40 cours et 159 leçons courtes, du niveau débutant (A1) au niveau avancé (C1)

• Un éditeur HTML et CSS en direct avec aperçu instantané, pour faire rapidement des essais et créer vos propres pages

• 20 projets guidés de design web, étape par étape : une barre d’outils, une grille de cartes, un en-tête fixe, un bouton pulsant et bien plus

• 20 missions de chasse aux bugs : une carte 42px plus large que sa colonne, une media query qui ne se déclenche jamais sur un téléphone, une fenêtre modale bloquée derrière la page

• Un examen final et un certificat de fin

• L’application est disponible en 22 langues

UN PARCOURS COMPLET, DU DÉBUTANT À L’AVANCÉ

• Syntaxe et sélecteurs, couleurs, arrière-plans et typographie

• Modèle de boîte, affichage, positionnement, unités et valeurs

• Pseudo-classes et pseudo-éléments

• Fondamentaux de Flexbox et Flexbox avancé

• Bases de Grid, zones de grille et mise en page avancée avec Grid

• Design responsive, media queries et container queries

• Propriétés personnalisées (variables), fonctions, spécificité, cascade et @layer

• Transitions, transformations, animations par images clés, filtres et modes de fusion

• Mode sombre et schémas de couleurs, défilement et débordement, clip-path et formes

• Débogage avec DevTools, architecture BEM, Sass, PostCSS et jetons de design

• Modèles de composants, modèles de mise en page modernes, performances et Houdini

UNE PRATIQUE QUI PORTE SES FRUITS

• Des quiz pour vérifier ce que vous avez appris

• Une fiche récapitulative avec 69 entrées sur les propriétés, les sélecteurs et la syntaxe de mise en page

• 50 questions d’entretien avec des réponses claires, utiles avant un entretien de développeur front-end ou web

• Une bibliothèque de code avec de courts exemples que vous pouvez ouvrir et modifier

• Enregistrez votre propre code, vos notes et vos leçons favorites

• World Coding Challenge : trois manches mondiales par jour, à résoudre en Python, JavaScript et dans d’autres langages

• Séries, XP, classement et rappels quotidiens pour maintenir votre pratique

MENTOR AI

• Bloqué sur une mise en page ou une propriété ? Posez une question au mentor AI sur un concept, une erreur ou votre propre code

• Bac à sable AI : décrivez une page et regardez le HTML et le CSS se construire

• Les utilisateurs gratuits bénéficient d’un quota AI quotidien ; Pro le rend illimité

À QUI S’ADRESSE L’APPLICATION

• Aux débutants complets qui font leurs premiers pas dans le développement web

• Aux designers qui veulent styliser leurs propres pages au lieu de transmettre des maquettes

• Aux étudiants qui souhaitent pratiquer davantage en parallèle d’un cours de design web

• Aux développeurs qui connaissent un peu le HTML et le CSS et veulent enfin comprendre Flexbox et Grid

• Aux personnes en reconversion qui se préparent à un emploi dans le front-end

GRATUIT ET PRO

Le premier cours, le premier projet guidé, deux missions et l’éditeur en direct sont gratuits, avec un quota quotidien pour le mentor AI. Pro déverrouille tous les cours, tous les projets et toutes les missions, l’examen pour obtenir le certificat et l’AI illimité, et supprime les publicités.

Commencez aujourd’hui, apprenez le CSS à votre rythme et stylisez votre première page en quelques minutes.