<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title>Ma première page avec du style</title>
<style type="text/css">
body { font-family:Georgia, "Times New Roman", Times, serif;}
body { background-color:#6CF; color:#00F; padding-left:9.5em; }
h1 { font-family:Helvetica, Geneva, Arial, sans-serif; }
ul.navbar { position:absolute; top:4em; left:1em; width:8em }
ul.navbar a { text-decoration:none; }
li a:link { color:blue; }
li a:visited { color:purple; }
li a:hover { color:red; text-decoration:underline; }
address { margin-top:1em; padding-top:1em; border-top:thin dotted }
</style>
</head>
<body>
<ul class="navbar">
<li><a href="ex0.html">Sans style</a></li>
<li><a href="ex1.html">Avec style (1)</a></li>
<li><a href="ex2.html">Avec style (2)</a></li>
[etc.]
<address>Fait le 5 juin 2011</address>
</body>
</html>
Enfin, nous avons donc un fichier html avec une feuille de style intégrée. Mais si la feuille de style est utilisée par plusieurs pages html dans le même site, il est préférable de copier la feuille de style dans un fichier à part et de faire une lien vers cette feuilles de style.
Exemple suivant ... Avec style (5).