CSS transform-style Eigenschaft

Definition und Verwendung

Die transform-style-Eigenschaft legt fest, wie eingebettete Elemente in 3D-Raum dargestellt werden.

Anmerkung:Diese Eigenschaft muss zusammen mit transform Eigenschaften zusammen verwenden.

Siehe auch:

CSS3-Tutorial:CSS3 2D Transformation

CSS3-Tutorial:CSS3 3D Transformation

HTML DOM Referenzhandbuch:transformStyle-Eigenschaft

Beispiel

Behalten Sie die 3D-Transformation der umgewandelten Kinderelemente bei:

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

Versuchen Sie es selbst

CSS-Syntax

transform-style: flach|preserve-3d;

Eigenschaftswert

Wert Beschreibung
flach Die Kinderelemente behalten ihre 3D-Position nicht bei.
preserve-3d Die Kinderelemente behalten ihre 3D-Position bei.

Technische Details

Standardwert: flach
Vererbbarkeit: nein
Version: CSS3
JavaScript-Syntax: Objekt.style.transformStyle="preserve-3d"

Browser-Unterstützung

Die Zahlen in der Tabelle verweisen auf die erste Browser-Version, die die Eigenschaft vollständig unterstützt.

Zahlen mit -webkit- oder -moz- als Präfix zeigen die erste Version, die den Präfix verwendet.

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-