Contrariamente a la creencia popular, CSS no sólo se utiliza para proporcionar estilo a una página web con el fin de hacer que se vea más atractiva. Hay un montón de cosas que uno puede hacer con CSS. CSS tiene la capacidad de crear animaciones e interacciones, CSS junto con HTML y Javascript permitirá a los desarrolladores web la oportunidad de jugar y experimentar con diferentes métodos.
El navegador web es como un lienzo en blanco que se puede utilizar para hacer arte. En este post veras 10 ejemplos de las cosas interesantes y creativas que la gente ha construido usando CSS. Desde personajes originales y animaciones impresionantes.
Chris Pattle creó los miembros de la familia Simpson utilizando sólo CSS. Tomó el rostro de cada personaje, lo partió en formas más pequeñas luego los unió de nuevo. Incluso le agrego animación haciéndolos parpadear, agregando de esta forma un poco de vida a los personajes.
Amr Zakaria ha creado unos Minions usando puro CSS. Los Minions vienen completos con los ojos parpadeantes y un gesto amistoso.
Aquí hay otro ejemplo divertido. Cuando se desplaza hacia la derecha, poco a poco, se ve como si estuviera girando o rotando la lata de Coca-Cola. Un efecto impresionante hecho puramente con CSS.
Este es un escudo de Vikingo creado por LukyVj. Está tan bien hecho que apenas se puede decir que se formó con CSS y no con un editor de gráficos.
Se trata de un exclusivo menú que se ve a través de un control deslizante de color que pone un icono del menú activo en color cuando se pasa el ratón sobre él. Juega con el deslizador y se siente impresionado por la forma fluida como se desliza a través del menú.
Este es un increíble ejemplo de aplicación text-shadow para lograr el efecto de señalización de neón con CSS. Pase el ratón sobre el texto para ver las luces de las letras 'c', 'n' y 'i'.
Es un bloque de queso sobre un plato, Hugo Giraduel creó este bloque de queso 3D usando CSS.
Otra de la obra de Hugo Giraudel.
Criaturas CSS son hechas por bennettfeely y pueden sonreír, reír, o llevar una expresión sin emociones, si quieres. Puedes crear tu propio personaje y compartirlo en Twitter.
Al cambiar el tamaño de la ventana del navegador el cuerpo del gato se estira o comprime en consecuencia con el ancho de la ventana del navegador. ¿Hasta qué punto cree usted que se puede estirar o aplastar la CSS-gatito?
¿Qué te parecen estos ejemplos, inspiradores? Envíanos tus comentarios y dinos que has hecho con CSS
