Text Outline mit CSS und HTML für alle Browser

2008-11-15

Ein klein bisschen suchen und letztlich doch gefunden: Wie macht man mit HTML (ohne CSS3 text-effect) einen Textrahmen?

<!– .textbg, .texttop {font-family:”Times New Roman”, Times, serif; font-size:70px;}
.textbg {color:red;}
.texttop {
color:#333333;
position:absolute; top:0; left:0;}
#topleft {position:absolute; top:-1px; left:-1px;}
#top {position:absolute; top:-1px; left:0px;}
#topright {position:absolute; top:-1px; left:1px;}
#bottomleft {position:absolute; top:1px; left:-1px;}
#bottom {position:absolute; top:1px; left:0px;}
#bottomright {position:absolute; top:1px; left:1px;}
#left {position:absolute; top:0px; left:-1px;}
#right {position:absolute; top:0px; left:1px;}
–>
<div class=”textholder”><span id=”topleft” class=”textbg”>Text Outlines</span>
<span id=”top” class=”textbg”>Text Outlines</span>
<span id=”topright” class=”textbg”>Text Outlines</span>
<span id=”bottomleft” class=”textbg”>Text Outlines</span>
<span id=”bottom” class=”textbg”>Text Outlines</span>
<span id=”bottomright” class=”textbg”>Text Outlines</span>
<span id=”left” class=”textbg”>Text Outlines</span>
<span id=”right” class=”textbg”>Text Outlines</span>
<span class=”texttop”>Text Outlines</span></div>

Gefunden bei Mike Wandling (Dort gibts auch ausführlichere Erläuterungen und ein Beispiel).