Hàm rotate() trong CSS

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

CSS rotate() quay 2D của phần tử định nghĩa hàm.

rotate() hàm trong transform sử dụng trong thuộc tính.

Mô hình

Ví dụ 1

Sử dụng rotate() Quay nhiều phần tử <div>:

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

Thử ngay

Ví dụ 2

Sử dụng rotate() Quay ảnh:

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

Thử ngay

Cú pháp CSS

rotate(góc)
Giá trị Mô tả
góc

Bắt buộc. Định nghĩa góc quay. Đơn vị có thể:

  • deg(độ)
  • rad(độ弧)
  • turn(vòng)

Chi tiết kỹ thuật

Phiên bản: Mô đun Chuyển đổi CSS Cấp 1

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.

Chrome Edge Firefox Safari Opera
1 12 3.5 3.1 10.5

Trang liên quan

Hướng dẫn:Chuyển đổi 2D trong 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 rotate3d() CSS

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

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

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