Khóa học đề xuất:

Hàm rotateZ() CSS

Định nghĩa và cách sử dụng rotateZ() CSS

rotateZ() Hàm định nghĩa quay 3D của một phần tử theo trục z. transform sử dụng trong thuộc tính.

Lưu ý:rotateZ(góc) Tương đương với rotate(góc)。

Mô hình

Ví dụ 1

Sử dụng rotateZ() Quay nhiều thẻ <div> theo trục z:

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

Thử ngay

Ví dụ 2

Sử dụng rotateZ() Quay hình ảnh theo trục z:

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

Thử ngay

Cú pháp CSS

rotateZ(góc)

Chi tiết kỹ thuật

Hỗ trợ trình duyệt

Số trong bảng biểu thị phiên bản trình duyệt đầu tiên hỗ trợ hàm này hoàn toàn.

Trang liên quan

Hướng dẫn:Chuyển đổi 3D CSS

Tham khảo:Thuộc tính transform CSS

Tham khảo:Thuộc tính rotate của CSS

Tham khảo:Hàm rotate() CSS

Tham khảo:Hàm rotate3d() CSS

Tham khảo:Hàm rotateX() CSS

Tham khảo:Hàm rotateY() CSS