Apprends ce qu'est le CSS, comment ajouter des styles au HTML, et écris tes premières règles CSS pour modifier l'apparence d'une page web.
CSS signifie Cascading Style Sheets (feuilles de style en cascade). Alors que le HTML définit la structure et le sens de ton contenu, le CSS contrôle l'apparence de ce contenu — couleurs, polices, espacement, mise en page, et plus encore.
Sans CSS, chaque page web serait simplement du texte noir sur fond blanc avec les styles par défaut du navigateur. Le CSS est ce qui transforme un document HTML brut en un site web visuellement attrayant et bien conçu.
Le mot cascading (en cascade) fait référence à la façon dont les styles sont appliqués : lorsque plusieurs règles ciblent le même élément, le CSS utilise un ensemble de règles de priorité pour déterminer quel style l'emporte. Tu en apprendras davantage sur cette cascade au fur et à mesure de ta progression.
Il existe trois méthodes pour ajouter du CSS à un document HTML :
Styles en ligne — Ajoute un attribut style directement à un élément HTML. Cette approche est rapide pour des modifications ponctuelles mais difficile à maintenir.
<p style="color: blue;">This text is blue.</p>Feuille de style interne — Place les règles CSS à l'intérieur d'une balise <style> dans le <head> de ton document. Cela sépare les styles du contenu mais les limite à une seule page.
<style>
p { color: blue; }
</style>Feuille de style externe — Écris le CSS dans un fichier .css séparé et lie-le avec une balise <link>. C'est la méthode préférée pour les vrais projets car les styles peuvent être partagés sur plusieurs pages.
<link rel="stylesheet" href="styles.css">Pour les leçons de ce cours, nous utiliserons principalement les feuilles de style internes (la balise <style>) afin que tu puisses voir à la fois le HTML et le CSS au même endroit.
<style>
/* selector { property: value; } */
h1 {
color: blue;
font-size: 32px;
}
p {
color: gray;
font-size: 18px;
line-height: 1.6;
}
</style>
<h1>Hello, CSS!</h1>
<p>This paragraph is styled with CSS.</p>Quelle méthode d'ajout de CSS est la meilleure pour partager des styles sur plusieurs pages ?