text-shadow

Bei­spiel­text mit text-shadow


<div style="text-shadow: .1em .2em .3em #666; font-size: 2em; color: mediumvioletred;">Beispieltext mit <em>text-shadow</em>
</div>

• 0.1em = ho­ri­zon­ta­le Verschiebung
• 0.2em = ver­ti­ka­le Verschiebung
• 0.3em = Blur [Un­schär­fe-Ra­di­us]
• #666 = Schattenfarbe
• me­di­um­vio­let­red = Schriftfarbe


Bei­spiel­text mit 2x Textschatten


<div style="text-shadow: 0 0 .5em red,.1em .1em .1em gold; color: white; font-size: 2em;">Beispieltext mit 2x Textschatten
</div>


Bei­spiel­text im Vordergrund


<div style="text-shadow: .1em .1em .1em black; color: white; font-size: 2em;">Beispieltext im Vordergrund
</div>


Bei­spiel­text mit Kontur


<div style="text-shadow: 0 -1px black,1px 0 black,0 1px black,-1px 0 black; color: white; font-size: 2em;">Beispieltext mit Kontur
</div>


Bei­spiel­text im Inset


<div style="text-shadow: 0 -1px 1px black,0 1px 1px white; color: silver; font-size: 2em; font-weight:900;">Beispieltext im Inset
</div>


Bei­spiel­text im Outset


<div style="text-shadow: 0 -1px 1px white,0 1px 1px black; color: silver; font-size: 2em; font-weight:900;">Beispieltext im Outset
</div>


Wei­te­re Informationen:
http://www.wss-expert.de/Style/Examples/007/text-shadow.html
http://pixeltuner.de/css3-text-shadow/