Utilizamos cookies propias y de terceros para mejorar nuestros servicios y mostrarle publicidad relacionada con sus preferencias. Si continúa navegando, consideramos que acepta su uso. Más información

Bonito efecto de degradado con solo CSS

En FREAKGROUP nos propone una manera muy sencilla el remplazar con CSS, los titulares o encabezados de nuestras entradas por imágenes con degradados, sin necesidad de usar Flash o JavaScript. Solo es necesario aplicar la siguiente tócnica: una etiqueta <span> vacía en el título y luego mediante la propiedad CSS position: absolute donde superponemos la imagen con el degradado. Este truco ha sido probado en la mayoría de los navegadores y nos dicen que funciona perfectamente.

efecto-degradado


Aplicar esta tócnica es perfecto para darle un aspecto diferente y de mayor impacto visual a nuestros títulos. Además no tenemos que armar cada uno de ellos con Photoshop con lo que ahorramos tiempo y ancho de banda. Podemos aplicarle este truco a cualquier tipo de fuente. En la figura siguiente puedes ver el resultado.

titulo-degradado


Para ver como funciona el truco te recomiendo que leas en su totalidad el artículo Efecto de degradado con CSS. Donde tienes el código empleado y otros detalles relacionados.

El artículo original es de Web Designer Wall, en donde podemos visualizar una demo previa de los efectos conseguidos, así como su descarga en compresión Zip. (todas las imágenes que he empleado son de dicha página).

Escrito por Toni

¿Te ha gustado? Compártelo:

Ver más sobre este tema aquí:

Tipografía, Photoshop, CSS


favoritoInsertar un Comentario


Nombre:

Email:

Comentario:

Escribe la siguiente palabra:

Sigue leyendo...

favoritoComentarios

No hay comentarios en este artículo.


favoritoArtículos relacionados:



Inscríbete al Boletín