Proprietà CSS transform-style

Definizione e uso

L'attributo transform-style determina come vengono rappresentati gli elementi annidati nello spazio 3D.

Nota:Questa proprietà deve essere utilizzata insieme a: transform usare insieme all'attributo.

Vedi anche:

Corso CSS3:Conversione 2D CSS3

Corso CSS3:Conversione 3D CSS3

Manuale di riferimento HTML DOM:Proprietà transformStyle

Esempio

Mantiene la trasformazione 3D dei figli convertiti:

div {
  transform: rotateY(60deg);
  transform-style: preserve-3d;
}

Prova personalmente

Sintassi CSS

transform-style: flat|preserve-3d;

Valore dell'attributo

Valore Descrizione
flat I figli dell'elemento non mantengono la loro posizione 3D.
preserve-3d I figli dell'elemento mantengono la loro posizione 3D.

Dettagli tecnici

Valore predefinito: flat
Ereditarietà: no
Versione: CSS3
Sintassi JavaScript: oggetto.style.transformStyle="preserve-3d"

Supporto del browser

I numeri nella tabella indicano la versione del browser che supporta completamente l'attributo.

I numeri con -webkit- o -moz- indicano la versione iniziale con prefisso utilizzata.

Chrome IE / Edge Firefox Safari Opera
36.0
12.0 -webkit-		 11.0 16.0
10.0 -moz-		 9.0
4.0 -webkit-		 23.0
15.0 -webkit-