Lecture audio :

Chapitre 1 : Introduction au CSS

Qu’est-ce que le CSS ?

Le CSS (Cascading Style Sheets – feuilles de style en cascade) est un langage utilisé pour styliser des pages web HTML. Il permet de contrôler l’apparence d’un site : couleurs, tailles, marges, polices, positionnement, animations, etc.

Pourquoi utiliser le CSS ?

  • 🎨 Pour rendre une page web visuellement agréable
  • 📱 Pour créer un design responsive (qui s’adapte aux écrans)
  • ⚡ Pour séparer le contenu (HTML) de la présentation (CSS)
  • 🔁 Pour réutiliser des styles sur plusieurs pages facilement

Les trois façons d’intégrer du CSS

1. CSS en ligne (inline)

Ajout direct dans l'attribut style d’un élément HTML :

<p style="color: red; font-size: 20px;">Texte rouge</p>

2. CSS interne (dans une balise <style>)

À placer dans le fichier HTML, dans la balise <head> :

<style>
  p {
    color: blue;
    font-size: 18px;
  }
</style>

3. CSS externe (fichier séparé)

La méthode la plus propre et recommandée :

<link rel="stylesheet" href="style.css">

Dans le fichier style.css :

p {
  color: green;
  font-size: 16px;
}

Remarque sur la "cascade"

En CSS, si plusieurs règles s'appliquent à un même élément, la dernière définie (ou la plus spécifique) sera prioritaire. C’est ce qu’on appelle le principe de cascade.

Conclusion

Grâce au CSS, tu vas pouvoir donner vie à tes pages HTML et leur donner un vrai style professionnel. Dans le prochain chapitre, nous allons explorer les sélecteurs CSS, qui permettent de cibler précisément les éléments HTML à styliser.

📝 QCM – Chapitre 1 : Introduction au CSS

Cascading Style Sheets
Creative Style Solutions
Computer Style Syntax

Structurer le contenu d'une page web
Styliser l'apparence d'une page web
Ajouter de l'interactivité à une page web

CSS en ligne (inline)
CSS interne (dans une balise &lt;style&gt;)
CSS externe (fichier séparé)
Besoin d'aide ?
Tuteur Virtuel
Bonjour ! Je suis votre tuteur virtuel. Comment puis-je vous aider avec ce cours aujourd'hui ?
Historique des conversations
Chargement...