CSS/Eigenschaften/transform

Browserunterstützung
caniuse.com

Die Eigenschaft transform ändert die Form eines HTML-Elementes. So lässt es sich etwa spiegeln, drehen oder scheren, aber auch verschieben

Erlaubte Werte

• none:
• translate(): Verschiebung
• scale(): Streckung
• rotate(): Drehung
• skew(): Scherung
• matrix(): Transformieren durch Angabe einer Transformationsmatrix

Vererbung steuernde Werte inherit, initial, unset und revert

Standardwert

none

anwendbar auf

alle Elemente

Vererbung

nein

animierbar

ja, als Transformation

Beispiel

:hover .box {  
   transform: 
     rotate(7deg)
     scale(2, 2)
     skewX(20deg)
     translate(150px, 150px);
  }

Beispiel für mehrere Transformationen

Siehe auch

• Transform
  • transform-Eigenschaft

Weblinks

• Spezifikation (W3C): transform
• MDN: transform
• Details: caniuse.com