Efecto de sombra en texto con CSS3
No es un efecto que suela utilizar mucho en mis diseños web pero es importante saber que está ahí para cuando lo necesites.
Los textos con sombra pueden ser muy atractivos para según que tipo de usuarios.
Después de darle un recorrido a mi historial de proyectos, recuerdo que lo he llegado a utilizar en algunos proyectos de tipo juego orientado o destinado a usuarios más jóvenes acostumbrados a jugar online donde los diseños de los mismos suelen ser más llamativos usando sombras en los textos y contenedores.
El caso es que yo he llegado a desarrollar juegos online tales como Rat Imperio o Ratalandia.
Justamente, son 2 proyectos que hice en mis inicios en la programación hará ya más de 15 años.
Actualmente, ya están desfasados pero, recuerdo perfectamente que algunos textos eran con sombras y, en aquel entonces, no era tan fácil como ahora aplicarle la sombra.
En este artículo vas a ver como dar o aplicar el efecto de sombreado en el texto con CSS3.
Ejemplo:
Para obtener un efecto de sombra en el texto como el anterior tan solo necesitas aplicar la siguiente regla en tu hoja de estilos CSS:
h1 {
text-shadow: 5px 5px 5px #FF0000;
}Y en el cuerpo de la página o <body> puedes agregar las etiquetas h1 allí donde las necesites:
Es necesario indicar que Internet Explorer no soporta la propiedad «text-shadow».
Autor
¿Buscas trabajo de programador?
9 artículos que te podrían interesar
Ver más sobre
Deja una respuesta