Exemples CSS

Vous trouverez ici des exemples de feuilles de styles, ainsi que leur résultat. Le code présent correspond à celui que l'on trouverait dans une feuille de style externe. Le trait sépare la partie du codage de feuille de style du code HTML qui permet de voir le résultat...




Ce code permet de modifier le style par défaut des balises H1 et H2. Ces balises sont utilisées en standard pour définir des titres. Le style standard est en taille de caractère grande, en noire, non soulignée...
Tous ces paramètres peuvent être modifiés, et voila comment faire :

Code	Résultat
h1 {color:red;border-bottom-width:1;text-indent:25px} h2 {color:green} <h1>Titre de niveau 1</h1> <h2>Titre de niveau 2</h2>	Titre de niveau 1 Titre de niveau 2

Cette exemple permet de supprimer le soulignement (option text-decoration:none). L'affichage du texte en rouge n'est fait que pour la lisibilité dans la page.

Code	Résultat
a {text-decoration:none;color:red} <a href="index.php">Index Informatique</a>	Index Informatique

Les types par défaut sont donc : serif, sans-serif, cursive, fancy et monospace.

Voici un exemple pour chaque cas :

Code	Résultat
<p style="font-family:serif">Test de serif</p> <p style="font-family:sans-serif">Test de sans-serif</p> <p style="font-family:cursive">Test de cursive</p> <p style="font-family:fancy">Test de fancy</p> <p style="font-family:monospace">Test de monospace</p>	Test de serif Test de sans-serif Test de cursive Test de fancy Test de monospace