Retour
Module 1 : Introduction à CSS
1.1 — Lier CSS à HTML Aperçu
🛠️ Projet 1 — Première mise en forme
Module 2 : Sélecteurs CSS
2.1 — Tous les types de sélecteurs Aperçu
🛠️ Projet 2 — Ciblage précis
Module 3 : Couleurs, fonds et dégradés
3.1 — Maîtriser les couleurs CSS Aperçu
🛠️ Projet 3 — Hero section
Module 4 : Typographie web
4.1 — Polices et texte Aperçu
🛠️ Projet 4 — Article typographié
Module 5 : Box Model — Le modèle de boîte
5.1 — Comprendre le Box Model Aperçu
🛠️ Projet 5 — Cartes produit
Module 6 : Display et positionnement
6.1 — Display : le comportement des boîtes Aperçu
🛠️ Projet 6 — Layout avec position
Module 7 : Flexbox — Layout flexible
7.1 — Flexbox fondamental Aperçu
🛠️ Projet 7 — Page centrée
Module 8 : Flexbox avancé
8.1 — Contrôler les enfants flex Aperçu
🛠️ Projet 8 — Layout 3 colonnes
Module 9 : CSS Grid — Layout en grille
9.1 — Grid fondamental Aperçu
🛠️ Projet 9 — Dashboard Grid
Module 10 : CSS Grid avancé
10.1 — Grid Areas et responsive Aperçu
🛠️ Projet 10 — Galerie auto-responsive
Module 11 : Responsive Design — Media Queries
11.1 — @media et breakpoints Aperçu
🛠️ Projet 11 — Site responsive
Module 12 : Mobile First — Approche pratique
12.1 — Techniques Mobile First Aperçu
🛠️ Projet 12 — Menu hamburger
Module 13 : Transitions et animations CSS
13.1 — Transitions et keyframes Aperçu
🛠️ Projet 13 — Page animée
Module 14 : Pseudo-classes et pseudo-éléments
14.1 — Pseudo-classes et pseudo-éléments Aperçu
🛠️ Projet 14 — Tableau stylé
Module 15 : Variables CSS et organisation
15.1 — CSS propre et scalable Aperçu
🛠️ Projet 15 — Design system
Module 16 : Projet final — Site responsive complet
16.1 — Site responsive professionnel Aperçu

Le reste de la formation est réservé aux inscrits.

S'inscrire gratuitement
Module 1 : Introduction à CSS Aperçu gratuit

1.1 — Lier CSS à HTML

📋 Objectifs d'apprentissage

  • Comprendre les 3 méthodes pour ajouter du CSS
  • Utiliser la balise <link> pour une feuille externe
  • Maîtriser la syntaxe : sélecteur { propriété: valeur; }
🎨 Les 3 méthodes pour ajouter du CSS ✅ Externe (recommandé)<link href="style.css"> ⚠️ Interne<style>...</style> ❌ Inline (éviter)<p style="color:red">

Pourquoi CSS externe ?

Un fichier CSS externe (lié via <link>) est partagé par TOUTES vos pages. Modifiez une couleur dans style.css → toutes les pages se mettent à jour. C'est LA bonne pratique.

La syntaxe CSS

sélecteur {
    propriété: valeur;
    propriété: valeur;
}
/* Exemple */
h1 {
    color: blue;
    font-size: 24px;
}

Le sélecteur cible les éléments HTML. Les propriétés définissent le style. Chaque déclaration se termine par ;.

🔑 À retenir

CSS = Cascading Style Sheets. Le « C » de Cascade signifie que les styles s'empilent : inline > interne > externe > défaut navigateur. Le plus spécifique gagne.

Ceci est un aperçu gratuit.
Voir la formation complète