Er is geen CSS ondersteuning.
Nee, dit is geen plaatje. De lettertjes hierboven zijn gewoon letters met font-family:"Comic Sans MS". Er stond al een outline font procedure op de dns5, maar die gebruikte document.write om de letters op het scherm te zetten. En zoals bij de meeste "scripters" bekend is vindt JSLint dat niet "leuk". Daarom (op verzoek) deze versie met de "innerHTML-oplossing". De code is zo eenvoudig, en zo kort, dat ik het geheel hieronder plaats. Copy/paste het geheel naar jouw webruimte, en pas alles naar wens aan. De stylesheet die hieronder staat behoort in de head-sectie geplaatst te worden en het script onderin de body-afdeling. De div met de naam -outlinetekst- kan je vervangen (als je dat wilt) door een p-tag met dezelfde naam. Alle validators (incl. html5) geven groen op de procedure.
<style type="text/css">
#outlinetekst{position:absolute;margin-left:100px;font-family:"Comic Sans MS",Arial,helvetica,sans-serif}
</style>
<div id="outlinetekst">
<script>
var detekst="outline-font";
var sizefont="font-size:60px;";
var borderdikte=2;
var borderkleur="#fb0";
var letterkleur="#020";
var x=-borderdikte;
var y=x;
var maaktekst="";
while(y<=borderdikte){
while(x<=borderdikte){
maaktekst=maaktekst+"<span style='"+sizefont+" color:"+borderkleur+"; position:absolute; left:"+x+"px; top:"+(-y)+"px;'>"+detekst+"</span><span style='"+sizefont+" color:"+borderkleur+"; position:absolute; left:"+x+"px; top:0;'>"+detekst+"</span><span style='"+sizefont+" color:"+borderkleur+"; position:absolute; left:"+x+"px; top:"+y+"px;'>"+detekst+"</span>";
document.getElementById("outlinetekst").innerHTML=maaktekst;
x=x+1;
}
y=y+1;
}
maaktekst=maaktekst+"<span style='"+sizefont+" color:"+letterkleur+"; position:absolute; left:0px; top:0px;'>"+detekst+"</span>";
document.getElementById("outlinetekst").innerHTML=maaktekst;
</script>
</div>
cache 07-12-2010