CSS3: La propiedad text-shadow

2 Oct

Bueno amiguetes, hoy os voy a hablar de la propiedad text-shadow de CSS3. Una propiedad que está cogienda fuerza rapidamente y que la usa desde WordPress, hasta tuenti, pasando por infinidad de blogs y hasta la web de mi abuela la del pueblo (si tuviera web o yo abuela en el pueblo).

¡Y eso que la propiedad data de 1997! Aunque no se ha hecho estándar hasta 2009, eso si.

Y es que desde que los navegadores (ejem… Internet Explorer?) empezaron a implementar propiedades del nuevo estándar, esta propiedad ha ido ganando popularidad, sobretodo por su facilidad de uso y sus resultados.

text-shadow en Tuenti (izq) y WordPress (dcha)

text-shadow en Tuenti (izq) y WordPress (dcha)

Ese efecto de relieve está causado por esta propiedad y su uso es el siguiente.

.selector{
 text-shadow: #color X Y desenfoque;
}

.selector{
 text-shadow: #CCCCC 20px 10px 2px;
}

Las coordenadas X e Y hacen referencia al desplazamiento de la sombra respecto al texto y el desenfoque cual es el radio de este que le vamos a dar. Por ejemplo si le asignamos un radio de 1px el texto será legible, pero si le asignamos un radio de 20px solo veremos una mancha. Es una función similar al efecto blur de cualquier programa de edición.

Esta propiedad ya funciona en Firefox, Chrome, Safari, Opera y el resto de navegadores decentes. Además, me gusta ver como cada vez se desprecia mas a Internet Explorer y no se intenta que las páginas se vean igual que en el resto de navegadores.

Links: text-shadow | Text-shadow, Photoshop like effects using CSS | Decorar texto con la propiedad text shadow

Una respuesta to “CSS3: La propiedad text-shadow”

Trackbacks/Pingbacks

  1. CSS3-La-propiedad-textshadow : Sysmaya - 3 octubre 2009

    […] Articulo Indexado en la Blogosfera de Sysmaya Bueno amiguetes, hoy os voy a hablar de la propiedad text-shadow de CSS3. Una propiedad que está cog Bueno amiguetes, hoy os voy a hablar de la propiedad text-shadow de CSS3. Una propiedad que está cog .. […]

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

A %d blogueros les gusta esto: