Sombra en texto (text-shadow)

El CSS nivel 3 tiene una propiedad llamada "text-shadow" que permite añadir una sombra a cada letra de un texto. En su forma más simple, es más o menos así:

h3 { text-shadow: 0.1em 0.1em  #333 }

Esto añade una sombra gris oscuro (#333) un poco a la derecha (0.1em) y abajo (0.1em) en relación con el texto normal. El resultado se ve así:

Texto con sombra

Varias sombras:

También es posible poner más de una sombra. En general, el resultado es un tanto extraño:

h3 { text-shadow: 0.2em 0.5em 0.1em #600,
	  -0.3em 0.1em 0.1em #060,
	  0.4em -0.3em 0.1em #006

      }

Texto con varias sombras

Trazar letras con contornos:

El ejemplo con dos sombras de la versión previa se puede llevar todavía más allá. Con cuatro sombras, es posible dar a las letras un contorno:

h3  { text-shadow: -1px 0 black, 0 1px black,
	  1px 0 black, 0 -1px blue

      }

Texto con Contorno