Met de CSS3 text shadow eigenschap kun je een tekst schaduw maken en toevoegen aan je website teksten zonder dat er afbeeldingen nodig zijn. Hoewel de syntaxis gemakkelijk te begrijpen is, is het moeilijk om de stijl te visualiseren met alleen de text-shadow code. Met de handige online tekst schaduwtool hierboven kun je snel een tekst schaduw maken door je css code aan te passen en meteen het schaduw effect te zien. Daarbij kun je ook de achtergrondkleur en tekstkleur van het voorbeeld veranderen zodat je ook met lichte tekst schaduwkleuren kunt werken. Verder kun je de voorbeeld tekst en het lettertype en grootte hiervan aanpassen.
De eerste drie waardes in de tekst schaduw css code worden aangegeven in pixels:
Hierna zie je twee waardes die de kleur en doorzichtigheid ervan bepalen:
Ja, je kunt bijvoorbeeld meerdere tekst schaduwinstellingen tegelijkertijd gebruiken door deze te scheiden met een komma.
Probeer de volgende codes maar eens:
text-shadow: #fff 0px 1px 1px, #000 0px -1px 1px;
of
text-shadow: 0 0 4px #ccc, 0 -5px 4px #ff3, 2px -10px 6px #fd3, -2px -15px 11px #f80, 2px -18px 18px #f20;
Meer informatie over CSS Text Shadow (Engels)