Khóa học khuyến nghị:

Hàm rotateX() trong CSS

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

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

Mô hình

Ví dụ 1

Sử dụng rotateX() Quay nhiều thẻ <div> theo trục x (hướng ngang):

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

Thử ngay

Ví dụ 2

Sử dụng rotateX() Quay ảnh theo trục x (hướng ngang):

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

Thử ngay

Cú pháp CSS

rotateX(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:CSS 3D 变换

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

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

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

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

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

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