La propriété CONTENT associée aux pseudo-classes BEFORE et AFTER permet d'insérer avant ou après un élément HTML d'autres éléments comme dans ce cas une chaîne de caractères.
Cette commande ne fonctionne sur aucun des navigateurs actuels, l'exemple a été simulé afin de donner un aperçu de ces possibilités.
Pour plus de renseignements veuillez consulter le W3C.
p.chapitre:before
{content: "Leçon : ";
font-size: 14pt;
font-style: italic}
p.note:before
{content: "Note : ";
font-size: 14pt;
font-style: italic}
p.exemple:before
{content: "Exemple : ";
font-size: 14pt;
font-style: italic}
p:after {content: "../.."}
...
<p class="chapitre"> ... </p>
<p class="note"> ... </p>
<p class="exemple"><br> ... </p> |
Leçon : 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. ../.. Note : Les caratères <!-- et --> 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. ../.. Exemple :
<head>
<title>...</title>
<style type="text/css">
<!--
h1 { color : blue }
-->
</style>
</head> |