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.