Como agrego sombra a un texto con CSS3?

Css | Escrito por Ezequiel M. | Enero - 21 - 2010

Text-Shadow es una de las nuevas propiedades en CSS3 que permite estilizar las fuentes. Esta propiedad es la solución a muchos trucos que se idearon para simular sombras en las fuentes de los sitios web.

Esta propiedad actúa a modo gráfico sin duplicar el texto y sin generar una imagen. Los valores para la propiedad Text-shadow tienen varios parámetros, en primera instancia hay que definir el color, luego el eje X e Y de la sombra y el efecto de difuminado. Es una propiedad oficial que funciona eficientemente en Firefox.

Código CSS:

.sombra{
color:#000000;
font:22px Arial, Helvetica, sans-serif;
text-shadow:#CCCCCC 2px 1px 2px; /*Color de la sombra - Eje X - Eje Y - Difuminado*/
}

Código xHtml: