Adieu le style inline

🎯 Objectif

Reconnaître le style inline, comprendre pourquoi il bloque ta feuille... et le supprimer pour rendre la main au CSS.

📖 Exemple

Un bénévole de la chorale a stylé son annonce directement dans le HTML :

<p style="color: green">Répétition jeudi à 20 h.</p>
<p style="color: green">Concert samedi à l'église.</p>

Ça fonctionne — le texte est bien vert. Et pourtant, ce code a deux problèmes :

1. Il se répète. La même instruction est recopiée sur chaque balise. Dix annonces demain ? Dix copies. Un changement de couleur ? Dix corrections.
2. Il est intouchable depuis la feuille. Le style inline pèse plus lourd que n'importe quelle règle : tant qu'il est là, ton style.css peut bien crier color: red, personne ne l'écoute.

La version saine tient en une règle :

p {
    color: green;
}

Le HTML redevient pur contenu, la présentation vit dans la feuille — chacun son métier, comme depuis le module 4.

📝 Consigne

Le club a passé tout son programme en bleu marine depuis la feuille. Pourtant, une ligne refuse d'obéir — et quelqu'un a même essayé de la forcer avec une classe. Mène l'enquête :

1. Repère la ligne qui n'est pas bleu marine
2. Trouve ce qui décide de sa couleur à la place de la feuille — indice : ce n'est pas dans l'onglet CSS
3. Supprime le coupable : la feuille doit reprendre la main sur tout le programme