CSS/Eigenschaften/rotate

Browserunterstützung
caniuse.com

Die Eigenschaft rotate dreht die Form eines HTML- oder SVG-Elements. Sie wurde im CSS Transforms Module Level 2 aus der transform-Eigenschaft herausgelöst.

Erlaubte Werte

• Winkelmaß (gilt dann für z-Achse)
• Name der Achse x y oder z + Winkelmaß

Vererbung steuernde Werte inherit, initial, unset und revert

Standardwert

0°

anwendbar auf

alle Elemente

Vererbung

nein

animierbar

ja, als Transformation

Beispiel

:hover .kreis {  
   rotate: 7deg;
  }
/* entspricht: */
:hover .box {  
   transform: rotate(7deg);
  }

Das obere Beispiel dreht eine Form mit der neuen CSS-Eigenschaft rotate. Sie erfordert ein Winkelmaß.
Die Form .box wird mit transform rotiert. Als Wert wird die rotate-Funktion mit einem Winkelmaß innerhalb der Klammern verwendet.

Beachten Sie: Die Syntax für den Wert unterscheidet sich von der der transform-Eigenschaft.

Siehe auch

• Transform
  • rotate
  • Transform/Drehen, Kreisen und Pendeln

Weblinks

• Spezifikation (CSSWG): Individual Transform Properties: the translate, scale, and rotate properties
• MDN: rotate
• caniuse:
• Details: caniuse.com