CSS rotate() Funktion

Definition und Verwendung

CSS rotate() 2D-Drehung des elements definiert durch die Funktion.

rotate() Funktion in transform im Attribut verwendet.

Beispiel

Beispiel 1

Verwenden Sie rotate() Mehrere <div>-Elemente drehen:

#myDiv1 {
  transform: rotate(25deg);
}
#myDiv2 {
  transform: rotate(45deg);
}
#myDiv3 {
  transform: rotate(-45deg);
}

Versuchen Sie es selbst

Beispiel 2

Verwenden Sie rotate() Bild drehen:

#img1 {
  transform: rotate(90deg);
}
#img2 {
  transform: rotate(45deg);
}
#img3 {
  transform: rotate(-45deg);
}

Versuchen Sie es selbst

CSS Syntax

rotate(Winkel)
Wert Beschreibung
Winkel

Erforderlich. Geben Sie den Drehwinkel an. Mögliche Einheiten:

  • deg(Grad)
  • rad(Bogenmaß)
  • turn(Umdrehung)

Technische Details

Version: CSS Transforms Modul Level 1

Browser-Unterstützung

Die Zahlen in der Tabelle stellen die Versionsnummer der ersten Browser dar, die diese Funktion vollständig unterstützen.

Chrome Edge Firefox Safari Opera
1 12 3.5 3.1 10.5

Verwandte Seiten

Anleitung:CSS 2D Transformation

Referenz:CSS transform Eigenschaft

Referenz:CSS rotate Eigenschaft

Referenz:CSS rotate3d() Funktion

Referenz:CSS rotateX() Funktion

Referenz:CSS rotateY() Funktion

Referenz:CSS rotateZ() Funktion