Axes dans un plan 3D

Exemples

Appliquer un effet 3D

Pour activer la 3D, un élément à besoin de la perspective. On peut l'utiliser de 2 façons. Soit via la propriété transform, soit la propriété perspective.
La perspective est le point de fuite d'un espace 3D.

transform : perspective(600px); est utilisée quand on veut appliquer une transformation 3D sur un élément.

perspective : 600px; est utilisée quand on veut appliquer une transformation 3D sur un ensemble d'éléments (on l'applique donc sur l'élément parent).

La valeur de la perspective détermine l'intensité de l'effet 3D. Plus sa valeur est élevée, plus la distance du point de fuite est élevée.

Perspective sur élément

 
 
 









Perspective sur le parent

 
 


















Projet concret

Source : http://www.html5-css3.fr/css3/transformations-3d-css3

Le texte dans mon carré rouge
Le texte dans mon carré vert