Thuộc tính xoay bù CSS
Ví dụ
Đặt xoay ba phần tử <img> di chuyển dọc theo một đường dẫn:
#fish1 {
offset-rotate: auto;
}
#fish2 {
offset-rotate: auto 90deg;
}
#fish3 {
offset-rotate: 90deg;
}
Hãy tự mình thử »Thêm ví dụ "Hãy tự mình thử" bên dưới.
Định nghĩa và cách sử dụng
Thuộc tính offset-rotate
thiết lập góc quay của phần tử hoạt hình di chuyển dọc theo một đường dẫn.
Giá trị mặc định: | tự động |
---|---|
Thừa hưởng: | KHÔNG |
Hoạt hình: | Đúng. Đọc về hoạt hình Hãy thử nó |
Phiên bản: | CSS3 |
Cú pháp JavaScript: | đối tượng .style.offsetRotate="45deg" Hãy thử |
Hỗ trợ trình duyệt
Các số trong bảng chỉ định phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ thuộc tính.
Property | |||||
---|---|---|---|---|---|
offset-rotate | 56.0 | 79.0 | 72.0 | Not supported | 43.0 |
Cú pháp CSS
offset-rotate: auto| value |initial|inherit;
Giá trị tài sản
Value | Description |
---|---|
auto | The element is facing the direction it moving along a path. This is default. |
<angle> | Specifies how much to rotate an element with an constant angle. |
auto <angle> | With both auto and <angle> given, the angle is added to the default rotation, in the clockwise direction. |
reverse | The element is rotated in the opposite direction of the default rotation. |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
Thêm ví dụ
Ví dụ
Chỉ định phép quay của một phần tử bằng đơn vị 'turn' thay vì 'deg':
div {
offset-rotate: 0.25turn;
}
Hãy tự mình thử »Trang liên quan
Hướng dẫn SVG HTML: Đường dẫn SVG
Hướng dẫn CSS: Hoạt hình CSS
Thuộc tính CSS offset: Thuộc tính CSS Offset
Thuộc tính CSS offset-anchor: Thuộc tính CSS Offset-anchor
Thuộc tính khoảng cách bù đắp CSS: Thuộc tính khoảng cách bù đắp CSS
Thuộc tính đường dẫn bù đắp CSS: Thuộc tính đường dẫn bù đắp CSS