Tyyliohjeen liittäminen Html-sivuun (tapa2)
Joissakin tilanteissa, kuten esimerkiksi testatessa uudenlaista sivun asemointia, voi olla helpompaa, että CSS-ohje on samassa dokumentissa HTML-merkkauksen kanssa, joilloin tyyliohjeen muokkaaminen ja testaaminen on kätevämpää. Tällöin tyyliohje lisätään head-elementtiin seuraavan esimerkin mukaisesti (tärkeät osat punaisella):
<html>
<head>
<title>CSS-esimerkki 1</title>
<style type="text/css">
h1 {color: green}
.omakorostus {font-weight: bold; color:red}
</style>
</head>
<body>
<h1>Vihreä otsikko</h1>
<p>Tässä kappaleessa sana <span class="omakorostus">pölvästi</span>
on korostettu!</p>
</body>
</html>
Alla kuvassa nro 1 on yllä olevan merkkauksen tulos Mozilla-selaimessa. Kuvassa 2 on sama ilman CSS-tyyliohjetta.
| Kuva 1 | Kuva 2 (ilman CSS:ää) |
|---|---|
 |
 |
