Thuộc tính offset-rotate CSS

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

offset-rotate Thuộc tính này được sử dụng để đặt góc quay của phần tử animation di chuyển theo con đường.

Mẫu

Ví dụ 1

Đặt góc quay của ba phần tử <img> di chuyển theo con đường:

#fish1 {
  offset-rotate: auto;
}
#fish2 {
  offset-rotate: auto 90deg;
}
#fish3 {
  offset-rotate: 90deg;
}

Thử ngay

Ví dụ 2

Định nghĩa góc quay phần tử bằng đơn vị turn thay vì deg:

div {
  offset-rotate: 0.25turn;
}

Thử ngay

Cú pháp CSS

offset-rotate: auto|góc|initial|inherit;

Giá trị thuộc tính

Giá trị Mô tả
auto Phần tử hướng về hướng di chuyển theo con đường.
góc Chỉ định góc quay phần tử với góc cố định.
auto góc Đồng thời chỉ định auto và góc,góc sẽ được thêm vào góc quay mặc định, theo hướng kim đồng hồ.
reverse Phần tử quay ngược lại hướng quay mặc định.
initial Đặt thuộc tính này về giá trị mặc định. Xem thêm initial.
inherit Từ tính này được kế thừa từ phần tử cha. Xem thêm inherit.

Chi tiết kỹ thuật

Giá trị mặc định: auto
Kế thừa: Không
Ch 制作 animation: Hỗ trợ. Xem thêm:Thuộc tính liên quan đến animation.
Phiên bản: CSS3
Cú pháp JavaScript: object.style.offsetRotate="45deg"

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ợ thuộc tính này hoàn toàn.

Chrome Edge Firefox Safari Opera
56 79 72 16 43

Trang liên quan

Giáo trình:SVG Path

Giáo trình:CSS Animation

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

Tham khảo:Thuộc tính offset-anchor CSS

Tham khảo:Thuộc tính offset-distance CSS

Tham khảo:Thuộc tính offset-path CSS

Tham khảo:Thuộc tính offset-position CSS