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

Hàm rotateY() trong CSS

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

rotateY() Hàm định nghĩa quay 3D của phần tử theo trục y (chiều dọc). transform Sử dụng trong thuộc tính.

Mô hình

Ví dụ 1

Sử dụng rotateY() Quay nhiều thẻ <div> theo trục y (chiều dọc):

#myDiv1 {
  transform: rotateY(40deg);
}
#myDiv2 {
  transform: rotateY(60deg);
}
#myDiv3 {
  transform: rotateY(80deg);
}

Thử ngay

Ví dụ 2

Sử dụng rotateY() Quay ảnh theo trục y (chiều dọc):

#img1 {
  transform: rotateY(40deg);
}
#img2 {
  transform: rotateY(60deg);
}
#img3 {
  transform: rotateY(80deg);
}

Thử ngay

Cú pháp CSS

rotateY(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（quay）

Chi tiết kỹ thuật

Phiên bản: CSS Transforms Module Level 2

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

Trang liên quan

Hướng dẫn:CSS 3D Biến đổi

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

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

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

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

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

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