Propiedades CSS

Sombras y efectos

Propiedad Valor Significado
text-shadow: pos-x pos-y blur color | none Aplica una sombra a un contenido de texto.

Con los valores pos-x y pos-y podemos indicar la posición de la sombra respecto al texto. El valor blur nos permite indicar el radio de desenfoque en píxeles, especificando así lo borrosa que estará la sombra (cuanto más alto el valor, más borrosa la sombra).

Sombras múltiples

Una de las características interesantes de CSS3 con background era la posibilidad de indicar fondos multiples separando por comas. En el caso de las sombras, también podemos hacer lo mismo, consiguiendo efectos muy vistosos:

p {
    text-shadow: 2px 2px 0 #AAA,        /* Sombra 1 */
                 6px 6px 2px #777,      /* Sombra 2 */
                 12px 12px 8px #444;    /* Sombra 3 */
}