I detta dokument länkas till en style sheets-mall, samt att det även inom head-taggarna ligger en inbäddad style sheets-mall unikt för just detta dokument.
Mallen ser ut som i exemplet för metod 1.
Koden inom head-taggarna ser ut så här! Observera att det kan bli oavsikliga radbrytningar i exempelkoden.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Min hemsida</title>
<link rel=stylesheet href="din_fil.css" type="text/css">
<style type="text/css">
<!--
body { background: yellow url(bild.gif) no-repeat }
p.indrag { text-indent: 1cm }
-->
</style>
</head>
Bakgrunden är gul, då den inbäddade mallen styr eftersom den ligger *närmast* elementet body, dessutom har en bakgrundsbild angetts samt att den inte ska *tijlas*, återupprepas utan bara visas en gång. Rubriken formateras via den externa filen, styckena och text i tabellcellerna likaså, samt länkarna.
Detta stycke har ett indrag på en centimeter angivet via<p class=indrag> (se den inbäddade style sheets-mallen) och dessutom har dessa ord formaterats blåa via
<span style="color: blue">dessa ord formaterats blåa</span>
En av tabellens två celler har formaterats via:
<td style="font-size: 20pt; color: green">
| grön större text |
| text angiven via externa filen |
Denna länk har formaterats via
<a style="text-decoration: underline; background-color: white" href="styltext.html#Exempel">Tillbaka</a>
Du som har Explorer ser att *hover*-effekten dock kvarstår enligt den externa style sheets-mallen.
Tillbaka