Definition and Usage
The rotation-point property is a pair of values that defines a point as an offset from the top left border edge.
Tip: The rotation-point property is used in conjunction with the rotation property.
| Default value: | 50% 50% |
|---|---|
| Inherited: | no |
| Version: | CSS3 |
| JavaScript syntax: | object.style.rotationPoint=”25% 25%” |
Syntax
rotation-point: value;
Values
| Value | Description |
|---|---|
| left top left center left bottom right top right center right bottom center top center center center bottom | If you only specify one keyword, the second value will be “center” |
| x% y% | Percentages refer to the width and height of the border box |
Examples
1 | h1 { |
2 | rotation-point:50% 50%; |
3 | rotation:180deg; |
4 | } |







