Gets or sets one or two values that represent the origin (the vanishing point for the 3-D space) of an object with an perspective property declaration.
This property is read/write.
perspective-origin: [ [
| left | center | right ] [
| top | center | bottom ] ? ] | [ [ left | center | right ] || [ top | center | bottom ] ]
One or two of the following origin values, separated by whitespace.
A floating-point number, followed by a supported length unit, that indicates the origin of transformation.
An integer, followed by a %. The value is a percentage of the total box length (for the first value) or the total box height (for the second value, if specified).
First value only. Equal to 0% or a zero length.
First value only. Equal to 50% or half the length of the box.
First value only. Equal to 100% or the full box length.
Second value only. Equal to 0% or a zero height.
Second value only. Equal to 50% or a half the height of the box.
Second value only. Equal to 100% or the full box height.
|Applies To||block-level and inline-level elements|
|Initial Value||50% 50%|
- CSS Transforms Module, Level 3, Section 11
This property does not affect how the object is rendered.
This property has no effect on child elements if the perspective property is not set for the object.
- How to bring your webpage to life with CSS transforms, transitions, and animations