CSS rotate() funktion

Definition och användning

CSS rotate() 2D-rotation av element definierade av funktionen.

rotate() Funktionen i transform Används i egenskapsförteckningen.

Exempel

Exempel 1

Använd rotate() Rotera flera <div>-element:

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

Prova själv

Exempel 2

Använd rotate() Rotera bild:

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

Prova själv

CSS syntax

rotate(angle)
Värde Beskrivning
angle

Obligatorisk. Ange rotationsvinkeln. Möjliga enheter:

  • deg (grader)
  • rad (båg)
  • turn (varv)

Tekniska detaljer

Version: CSS Transforms Module Level 1

Webbläsarstöd

Numrerna i tabellen representerar den första webbläsarens version som fullständigt stöder denna funktion.

Chrome Edge Firefox Safari Opera
1 12 3.5 3.1 10.5

Relaterade sidor

Tutorial:CSS 2D transformation

Referens:CSS transform egenskap

Referens:CSS rotate egenskap

Referens:CSS rotate3d() funktion

Referens:CSS rotateX() funktion

Referens:CSS rotateY() funktion

Referens:CSS rotateZ() funktion