Polecane kursy:

CSS rotateZ() funkcja

Definicja i użycie rotateZ() CSS

rotateZ() Funkcja definiuje 3D obrót elementu wokół osi z. transform w użyciu atrybutu.

Wskazówka：rotateZ(kąt) Równoważne rotate(kąt)。

Przykład

Przykład 1

Użyj rotateZ() Obracanie wielu elementów <div> wokół osi z：

#myDiv1 {
  transform: rotateZ(40deg);
}
#myDiv2 {
  transform: rotateZ(60deg);
}
#myDiv3 {
  transform: rotateZ(-45deg);
}

Spróbuj sam

Przykład 2

Użyj rotateZ() Obracanie obrazu wokół osi z：

#img1 {
  transform: rotateZ(40deg);
}
#img2 {
  transform: rotateZ(60deg);
}
#img3 {
  transform: rotateZ(-45deg);
}

Spróbuj sam

CSS składnia

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

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

  • deg（stopnie）
  • rad（radiany）
  • turn（obrót）

Szczegóły techniczne

Wersja： CSS Transforms Module Level 2

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
12 12 10 4 15

Strony związane

教程：CSS 3D przekształcenia

Odnośnik:Atrybut transform w CSS

Odnośnik:CSS właściwość rotate

Odnośnik:CSS rotate() funkcja

Odnośnik:Funkcja rotate3d() w CSS

Odnośnik:Funkcja rotateX() w CSS

Odnośnik:Funkcja rotateY() w CSS