CSS rotate() funkcja

Definicja i użycie

CSS rotate() 2D obrót elementu definiowanego funkcją.

rotate() Funkcja w transform w użyciu atrybutu.

Przykład

Przykład 1

Użyj rotate() Obrót wielu elementów <div>:

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

Spróbuj sam

Przykład 2

Użyj rotate() Obrót obrazu:

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

Spróbuj sam

CSS składnia

rotate(kąt)
Wartość Opis
kąt

Wymagane. Określ kąt obrotu. Możliwe jednostki:

  • deg(stopień)
  • rad(promień kąta)
  • turn(obrót)

Szczegóły techniczne

Wersja: CSS Transforms Module Level 1

Wsparcie przeglądarki

Liczby w tabeli oznaczają pierwszą wersję przeglądarki, która w pełni obsługuje tę funkcję.

Chrome Edge Firefox Safari Opera
1 12 3.5 3.1 10.5

Strony związane

Tutorial:CSS 2D transformacje

Odniesienie:Atrybut CSS transform

Odniesienie:Atrybut rotate w CSS

Odniesienie:Funkcja CSS rotate3d()

Odniesienie:CSS rotateX() funkcja

Odniesienie:Funkcja CSS rotateY()

Odniesienie:Funkcja CSS rotateZ()