Dentro de las muy interesantes novedades que introduce CSS3 encontramos las opciones para simular efectos 3D.
La propiedad perspective es la que nos abre el camino para crear perspectivas utilizando reglas introducidas por CSS3.
Desde un elemento «root» o «padre» podremos afectar a sus hijos para que tengan una perspectiva que simule un efecto 3D.
Por el momento esta característica es soportada por navegadores Chrome y Safari en sus versiones más modernas, por esta razón será recomendable utilizar el prefijo webkit, si empleamos esta funcionalidad en nuestros proyectos.
¿Un ejemplo? Veamos a continuación como construimos las reglas desde el elemento root:
perspective:250; -webkit-perspective:250;
También podremos indicar el origen, como vemos a continuación:
perspective-origin: 25% 25%; -webkit-perspective-origin: 25% 25%;
Trabajando con otras opciones de transformación y rotación, podremos lograr efectos muy interesantes en nuestros diseños.
Más sobre Diseño y desarrollo Web
Autor de los libros: Webmaster Profesional, HTML5: Comprenda el cambio y Apps HTML5 para móviles. Soy especialista en Desarrollo Web. Realizo proyectos basados en Inteligencia Artificial. Colaboré como autor y editor de contenidos para revistas, colecciones y diversos medios impresos y digitales. Brindo capacitaciones, clases de formación y consultorías sobre lenguajes de programación y herramientas para Desarrollo Web y móvil en modalidad online y presencial.
No estaria mal un ejemplo