Démonstration de content

Il y a deux méthodes principales pour placer une feuille de style. La première consiste à placer la feuille de style dans l'entête de document. La seconde consiste à placer la feuille de style dans un fichier séparé, et à y faire référence dans l'entête du document. Cette dernière technique permet de réutiliser la même feuille de style dans plusieurs documents.

Les caratères  servent à commenter la feuille de style pour les navigateurs qui ne les reconnaissent pas. Dans ce cas, les déclarations de styles risqueraient de perturber l'interprétation de la page.

Code source :

<html>
  <head>
    <style>
      .chapitre:before {
        content: "Leçon : "; 
        font-size: 14pt; 
        font-style: italic
      }
      P.note:before {
        content: "Note : "; 
        font-size: 14pt; 
        font-style: italic
      }
      PRE.exemple:before {
        content: "Exemple : "; 
        font-size: 14pt; 
        font-style: italic; 
      }
      P:after { content: "../.." }
    </style>
  </head>
  <body>
    <p class="chapitre"> ... </p>

    <p class="note"> ... </p>

    <pre class="exemple"> ... </pre>
  </body>
</html>