Ce fichier HTML est lié au fichier cours4.css ( Cas classique )

Ce fichier CSS dit que la couleur de fond de page doit être jaune.

body { background-color: yellow; }

Balise : style

Toutefois, l'apparence de ce fichier est personnalisée via des instructions situées dans la balise <style>,
placée après la balise <link />.

<head>
  ...
  <link rel="stylesheet"  href="cours4.css">
  <style>
        body {background-color : orange;}
  </style>
    ...
</head>

La balise <style> doit être située dans la zone head (1).

Le navigateur exécute le dernier ordre concernant cet élément.
Or, concernant la couleur de fond de page, la dernière instruction est : mettre en orange.
Au final, la couleur de la page est donc orange.

Attention à l'ordre des balises : <style> et <link />.
Si la balise <link /> est la dernière, les instructions CSS contenues dans ce fichier sont alors prioritaires sur celles contenues dans la zone head !

(1) Cependant, il est possible de spécifier une zone dans le body où le style s'applique à la balise parente et à tous les enfants de cette balise parente. Plus d'info

Attribut : style

Toutefois, il est possible de pousser encore plus loin la personnalisation en fixant l'apparence d'une seule zone, via l'attribut "style".

N'oublions pas qu'une zone peut contenir plusieurs zones. Ici, deux paragraphes.

<div style="background-color: red; color: white">
    <p>Toutefois, il est possible de pousser encore plus loin la personnalisation en fixant
    l'apparence d'une seule zone, via l'attribut "style".</p>
    <p>N'oublions pas qu'une zone peut contenir plusieurs zones. Ici, deux paragraphes.</p>
</div>