Trucos CSS3 – Efectos con CSS3 simples

El nuevo CSS nos ha dejado a todos sorprendidos y queremos aprender todos los trucos ya. Por eso les traemos una recopilación muy interesante que estamos seguros sabrán emplear en sus proyectos. Desde botones hasta menúes les traemos en esta ocasión para que puedan equiparse desde lo más complejo hasta lo más simple.

Botones CSS3 con gradiente, hover y onclick

Los botones con gradientes quedan geniales, pero el problema llega cuando tenemos que hacerlos en varios tamaños. Para simplificar el proceso de diseño Mark de ‘The ZURB blog’ nos explica como crear botones con gradientes de diferentes colores, hover y como si fuera poco un efecto onclick muy interesante. Lo más importante de esta técnica es que los botones son escalables.

Demostración

Efecto Polaroid con hover sólo con CSS

Efecto para fotos con CSS3, crea tus Polaroid sin utilizar Photoshop

Ir al artículo

En un nuevo tutorial desarrollado por ‘ZURB’ les mostramos un efecto interesantísimo, la transformación mediante CSS2 y CSS3 de imágenes en fotografías Polaroid ¡con efecto hover! y sin nada de Javascript. Veamos el tutorial y la página de ejemplo con otras tantas explicaciones útiles.

Demostración

Efectos en textos: Letras presionadas y sombra

En este tutorial 2 en 1 realizado por Chris Spooner de Line25 aprenderán a crear en pocos pasos el efecto de letras presionadas en una superficie y el efecto de sombra utilizando CSS3. Con la llegada del nuevo CCS3 no será necesario realizar imagen por imagen y el único defecto es que las personas que utilizan los navegadores que no soportan este lenguaje actualizado verán el texto sin efectos.

Demostración

Menú multinivel o Drop Down Menu con CSS3

Web Designer Wall nos trae este menú multinivel, colapsable o Drop Down de estilo Mac muy elegante y prolijo realizado enteramente en CSS3. Con sus bordes redondeados y los gradientes sutiles este es un menú que tienes que considerar cuando estés renovando tu sitio web.

Demostración
Scroll to top