Une remarque ? Une suggestion ?...

Merci de participer à l'amélioration de ce site. Prenez le temps de rédiger votre remarque le plus précisément possible :

CSS - Propriété transform-style

Description de la propriété transform-style.

Définit comment se comportent les enfants de l'élément lorsque ce dernier subit une transformation 3d. Plus précisément transform-style définit si les enfants de l'élément ont leur propre espace 3d ou bien, à l'inverse, s'ils sont toujours dans le même plan que le parent.

Syntaxes pour transform-style.

  • transform-style: flat;

    Valeur par défaut. Les éléments enfants de l'élément animé n'ont pas d'espace 3D qui leur serait propre.

  • transform-style: preserve-3d;

    Les éléments enfants de l'élément animé ont leur propre espace 3D, ce qui permet des restitutions plus réalistes des effets 3d.

  • transform-style: initial;

    La valeur initiale est flat.

  • transform-style: unset; transform-style: inherit;

    Reportez-vous à la description générale de ces valeurs.

Simulateur.

transform-style :

Voir aussi...

Transformations géométriques - Propriétés.

  • backface-visibility : Visibilité de la face arrière de l'élément (pendant sa rotation).
  • perspective : Effet de perspective appliqué à un élément ayant subi une transformation 3D.
  • perspective-origin : Position de l'observateur dans le cas d'une déformation 3D avec perspective.
  • transform : Applique une transformation géométrique.
  • transform-origin : Point d'origine pour certaines transformations.

Transformations géométriques - Fonctions.

  • matrix() : Applique une transformation composite à un élément (translations, rotations...)
  • matrix3d() : Applique une série de transformations 3D à un élément.
  • perspective() : Définit la hauteur de l'observateur dans le cas d'une transformation 3D.
  • rotate() : Définit une rotation de l'élément en 2D (dans le plan de l'écran).
  • rotate3d() : Définit une rotation 3D de l'élément autour d'un axe quelconque en 3D.
  • rotateX() : Définit une rotation de l'élément autour de l'axe X (en 3D),
  • rotateY() : Définit une rotation 3D de l'élément autour de l'axe Y.
  • rotateZ() : Définit une rotation de l'élément autour de l'axe Z.
  • scale() : Définit un agrandissement ou une réduction de l'élément.