Style perspective Property
Example
Set the perspective from which an element is viewed:
Definition and Usage
The perspective property defines the distance between the 3D element and the view, measured in pixels. This property allows you to change the perspective from which the 3D element is viewed.
When the perspective property is defined for an element, its child elements get a perspective effect, not the element itself.
Note: The perspective property only affects 3D transformed elements!
Tip: Use this property with the perspectiveOrigin property to change the bottom position of a 3D element.
Browser Support
IE10+ and Firefox support the perspective property.
Chrome, Safari, and Opera support an alternative property, WebkitPerspective.
Syntax
Return the perspective property:
Set the perspective property:
Property Values
| Value | Description |
|---|---|
| length | The distance between the element and the view, measured in pixels. |
| none | Default value. Same as 0. No perspective is set. |
| initial | Sets this property to its default value. See initial |
| inherit | Inherits this property from its parent element. See inherit |
Technical Details
| Default value: | none |
|---|---|
| Return value: | String, representing the perspective property of the element. |
| --- | --- |
| CSS Version | CSS3 |
| --- | --- |
Related Articles
JavaScript Style Object: perspectiveOrigin Property
CSS Reference: perspective Property