Transformaciones

El módulo CSS Transforms Module Level 1 nos permite realizar transformaciones sobre los diversos elementos de la página HTML. Este módulo está todavía en estado Working Draft a 26 de noviembre de 2013: http://www.w3.org/TR/css-transforms-1/

Se trata de una propiedad CSS3 con unos resultados, cuando menos, espectaculares. En efecto, sus posibilidades rompen en cierto modo con la rigidez del diseño de páginas web. Esta propiedad permite aplicar distintas transformaciones sobre un elemento, como por ejemplo una rotación, un cambio de escala, un zoom o una deformación oblicua. Unida a las transiciones (véase el punto siguiente), juntas forman un binomio que promete modificar en profundidad la visualización de los sitios web del futuro.

transform:

rotate(ángulo), rotate3d(ángulo), rotateX(ángulo), rotateY(ángulo), rotateZ(ángulo), scale(número), scale3d(número), scaleX(número), scaleY(número), scaleZ(número), skew(ángulo), skewX(ángulo), skewY(ángulo), skewZ(ángulo), translate(longitud), translate3d(longitud), translateX (longitud), translateY(longitud), translateZ(longitud)

La propiedad transform la reconocen perfectamente los navegadores modernos. He aquí la matriz de compatibilidad de Can I use:

images/c22-001.png

Veamos los distintos parámetros de esta propiedad transform.

Rotación

La rotación de un elemento se obtiene mediante el parámetro rotate(ángulo), donde ángulo...

Si desea saber más, le proponemos el siguiente libro:
couv_RIT35HTM.png
60-signet.svg
Versión impresa
20-ecran_lettre.svg
Versión online
41-logo_abonnement.svg
En ilimitado con la suscripción ENI
130-boutique.svg
En la tienda oficial de ENI
Anterior
Módulos para los diseñadores gráficos
Siguiente
Transiciones