Rekomendasi kursus：

Fungsi rotateZ() CSS

Definisi dan penggunaan rotateZ() CSS

rotateZ() Fungsi menentukan putar 3D elemen sekitar sumbu z. transform digunakan dalam properti.

Petikan：rotateZ(angle) Sama dengan rotate(angle)。

Contoh

Contoh 1

guna rotateZ() Putar beberapa elemen <div> mengelilingi sumbu z：

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

Coba sendiri

Contoh 2

guna rotateZ() Putar gambar mengelilingi sumbu z：

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

Coba sendiri

Syarat CSS

rotateZ(angle)
Value Description
angle

Diperlukan. Tentukan sudut putar. Satuan yang mungkin：

  • deg（derajat)
  • rad（sudut)
  • turn（gir)

Detil teknikal

Versi： Modul Transformasi CSS Level 2

Dukungan perekap

Angka di dalam tabel menunjukkan versi perekap yang pertama yang sepenuhnya mendukung fungsi ini.

Chrome Edge Firefox Safari Opera
12 12 10 4 15

Halaman yang berkenaan

Tutorial：Transformasi 3D CSS

Rujukan：Sifat transform CSS

Rujukan：属性 CSS rotate

Rujukan：Fungsi rotate() CSS

Rujukan：Fungsi rotate3d() CSS

Rujukan：Fungsi rotateX() CSS

Rujukan：Fungsi rotateY() CSS