Menu
CoddyTech
Commencer à apprendre
html iconFait partie du Journey HTMLParcours

Apprendre CSS

Un cours CSS gratuit et interactif. À chaque leçon, vous mettez en forme du vrai HTML - sélecteurs, modèle de boîte, couleurs, polices, flexbox, grid, design responsive - avec un aperçu en direct au fil de votre saisie et un certificat gratuit à la fin. Ce cours fait partie du parcours HTML plus large, donc le contexte de balisage dont CSS a besoin est juste là.

Commencer à apprendre(c'est gratuit)
Voir le programmePlayground Style avec CSS

13,993+ codders inscrits

119 leçons114 défis582 questions de quiz

Programme

2 sections3 projets119 leçons114 défis582 questions de quiz

Cette section fait partie du Journey HTML. Le programme complet contient d'autres sections : clique sur n'importe quel aperçu ci-dessous pour le voir sur la page du Journey.

  1. Section 1Fondamentaux60 leçons
  2. Section 2

    Style avec CSS

    Commencer la sectionDémarrerDévelopperRéduire    Donnez vie à vos pages web avec des couleurs, des mises en page et des styles76 leçons110 défis418 questions3 projets

    Introduction

    5 leçons540

    Ajouter du CSS

    4 leçons725

    Sélecteurs de base

    7 leçons1247

    Fondamentaux du texte

    8 leçons1450

    Couleurs et arrière-plans

    5 leçons834

    Menu du café

    Projet3 leçons3

    Modèle de boîte – Partie 1

    6 leçons943

    Modèle de boîte – Partie 2

    5 leçons833

    Flexbox

    6 leçons943

    Formulaire de connexion

    Projet4 leçons4

    Techniques de mise en page

    7 leçons1151

    Bases du responsive design

    6 leçons1052

    Page web Tonga

    Projet6 leçons6

    Défis finaux

    4 leçons4
  3. Section 3

    Maîtrise du CSS

    Commencer la sectionDémarrerDévelopperRéduire    Passez vos compétences CSS au niveau supérieur !43 leçons40 défis164 questions

    Maîtrise des sélecteurs – Combinaisons

    6 leçons539

    Pseudo-classes interactives

    5 leçons431

    Pseudo-classes structurelles

    5 leçons432

    Projet de menu déroulant

    4 leçons4

    Effets visuels

    5 leçons536

    Landing Page

    5 leçons5

    Construire avec CSS Grid

    4 leçons426

    Site web Flavor Fiesta

    4 leçons4

    Défis finaux

    5 leçons5
  4. Section 4Front-end pratique35 leçons
  5. Section 5JavaScript en action27 leçons
Voir le programme complet du Journey HTML
Ce que vous obtenez
Tout ce que vous utiliserez pour apprendre à coder

Apprendre en Faisant

Écrivez du vrai code, interrogez des bases de données, créez des sites web et maîtrisez les prompts IA. Nos leçons interactives couvrent toutes les compétences dont les développeurs modernes ont besoin.

playground.js
Éditeur de Code
1const greeting = "Hello, Coddy!"
2function sayHi(name) {
3    return greeting + " " + name
4}
5
bottombar Collapse icon
Test n°1test Case Success icon
Test n°2test Case Success icon
Test n°3test Case Failure icon
Entrée
"Alex"
Sortie
"Hello, Coddy! Alex"

Construisez Votre Série

Restez constant et regardez vos progrès grandir! Suivez votre habitude quotidienne de codage, protégez votre série avec des jours de gel et gagnez des récompenses en vous connectant chaque jour.

12 jours de série

Revenez demain pour maintenir votre série!

fire Filled icon
left icon

January 2026

right icon

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

21

22

23

24

25

26

27

28

29

30

product Double Or Nothing icon

Quitte ou Double

Jour 5 sur 7

fire Freeze icon

Gel de Série

2 left

Codez Partout

Emportez votre parcours de codage avec vous! Pas de configuration, pas de téléchargements : ouvrez et commencez à coder. Disponible sur iOS, Android et Web avec des notes de 4.9 étoiles.

app Store iconTélécharger surApp Storegoogle Play iconDisponible surGoogle Play
Python
7Série
250Score
5Énergie
Variables
journey Hex Done Base iconjourney Hex Done Shadow iconjourney Hex Done Top iconjourney Lesson Done icon
journey Path Right Done icon
journey Hex Done Base iconjourney Hex Done Shadow iconjourney Hex Done Top iconjourney Lesson Done icon
journey Path Left Done icon
journey Hex Active Base iconjourney Hex Active Shadow iconjourney Hex Active Top iconjourney Lesson Theory Challenge icon
Continuer
journey Path Right icon
journey Hex Locked Base iconjourney Hex Locked Shadow iconjourney Hex Locked Top iconjourney Lesson Theory Challenge icon
journey Path Left icon
journey Hex Locked Base iconjourney Hex Locked Shadow iconjourney Hex Locked Top iconjourney Lesson All icon
Parcours
Objectifs
Classement
Profil
4.9
ÉtoileÉtoileÉtoileÉtoileÉtoile
Note

Vous N'êtes Pas Seul

Affrontez les classements mondiaux, invitez des amis pour gagner des récompenses et célébrez les succès des autres. Coder, c'est mieux entre amis!

Ligue Challenger
Ligue ChallengerLes 7 premiers avancent
leaderboard First icon1
avatar 1 icon
fire Filled icon
Alex7+ Days
2840
leaderboard Second icon2
avatar 2 icon
fire Filled icon
Jordan7+ Days
2650
leaderboard Third icon3
avatar 3 icon
fire Filled icon
Sam7+ Days
2420
4
avatar 4 icon
Casey
2180
5
avatar placeholder icon
fire Filled icon
Morgan7+ Days
1950
leaderboard Arrow Up iconZone de promotionleaderboard Arrow Up icon

Apprenez comme vous voulez

Lisez, écoutez, testez-vous, demandez à l'IA ou retrouvez ce que vous avez déjà étudié. Chaque leçon s'adapte à vous.

Intro aux variables
Audio

Une variable est un conteneur nommé qui stocke une valeur réutilisable plus tard dans votre programme.

En Python, on en crée une en écrivant le nom, un signe égal, puis la valeur à stocker.

La valeur peut évoluer : réassigner le nom le fait simplement pointer vers une nouvelle valeur.

1xSarah

Certifiez-vous

Gagnez des certificats pour chaque cours terminé. Ajoutez-les à votre profil LinkedIn et CV pour montrer votre expertise en programmation aux employeurs.

CoddyCertificat de Réussite
Ceci certifie queJean Duponta complété avec succès
python iconFondamentaux de Python
Vérifié
Datejanv. 2026
LinkedInAjouter à LinkedIn

Pourquoi apprendre CSS avec Coddy

  • Écrivez du CSS dans votre navigateur et regardez la page se remettre en forme en direct. Aucune étape de build, aucune configuration d'éditeur. Chaque modification d'un sélecteur ou d'une propriété s'affiche instantanément, pour que vous voyiez ce que fait réellement chaque règle.
  • Le CSS essentiel : sélecteurs et spécificité, modèle de boîte, positionnement, flexbox, CSS grid, transitions, media queries et design responsive. Le CSS dont chaque développeur front-end a besoin au quotidien.
  • Les indices IA vous aident à déboguer ce qui fait toujours trébucher tout le monde - surprises de spécificité, débordements de mise en page, comportements étranges de flexbox - sans dévoiler la solution, pour que CSS devienne intuitif au lieu de magique.
  • Un certificat CSS gratuit à la fin de la section. Il se combine naturellement aux cours HTML et JavaScript pour une base front-end complète.

Questions fréquentes sur l'apprentissage de CSS

Qu'est-ce que CSS ?

CSS (Cascading Style Sheets) est le langage qui contrôle l'apparence des pages HTML - couleurs, polices, espacements, mise en page, animations, comportement responsive selon la taille de l'écran. Le HTML définit ce qui se trouve sur la page ; le CSS définit comment c'est présenté.

CSS est-il difficile à apprendre ?

Les bases de CSS - sélecteurs, couleurs, polices, modèle de boîte - s'acquièrent facilement en quelques heures. Les parties plus ardues viennent ensuite : les règles de spécificité, les mises en page flexbox et grid, et le fait de rendre les choses correctes sur chaque taille d'écran. Le cours les introduit par petites étapes avec un aperçu en direct, pour que vous voyiez exactement ce que fait chaque règle.

Dois-je apprendre HTML avant CSS ?

Oui. Le HTML définit la structure d'une page ; le CSS la met en forme. Sans HTML, vous n'avez rien à styliser. C'est pour cette raison que cette section CSS fait partie du parcours HTML - la section sur les fondamentaux du HTML vient en premier, puis vous passez l'essentiel du parcours à la mettre en forme.

Quelle est la différence entre CSS, Flexbox et Grid ?

Flexbox et Grid sont des modules de mise en page à l'intérieur de CSS - ce ne sont pas des technologies distinctes, ce sont des fonctionnalités de CSS. Flexbox est idéal pour les mises en page à une dimension (une rangée de cartes, une barre de navigation). Grid est idéal pour les mises en page à deux dimensions (une page entière, une disposition de cartes complexe). La plupart des sites réels utilisent les deux, et le cours explique quand recourir à chacun.

Puis-je apprendre CSS en ligne gratuitement ?

Oui. La section interactive sur CSS est gratuite - des leçons complètes, des exercices de code, un aperçu en direct et un certificat. Tout se déroule dans le navigateur, vous n'avez donc besoin d'installer aucun éditeur ni outil pour commencer.

Est-ce que j'obtiens un certificat après le cours CSS ?

Oui. Terminer la section CSS vous donne un certificat d'achèvement gratuit. Une preuve vérifiable que vous pouvez ajouter à votre CV ou partager sur LinkedIn, aux côtés des certificats HTML et JavaScript, dans le cadre d'un portfolio front-end.

Parcours d'apprentissage qui incluent ce cours

Ce cours est une étape d'un parcours plus long : plusieurs cours dans l'ordre où un mentor les enseignerait, chacun avec son propre certificat gratuit.

Illustration des langages de programmation de Coddy

Apprends Style avec CSS avec Coddy

Commencer