Style perspective Property

Style 对象参考手册Style Object

Example

Set the perspective from which the element is viewed:

document.getElementById("myDIV").style.perspective="50px";

Try it Yourself »

Definition and Usage

The perspective property defines the distance between a 3D element and the view, in pixels. This property allows you to change the perspective at which the 3D element is viewed.

When the perspective property is defined for an element, its child elements get the perspective effect, not the element itself.

Note:The perspective property only affects 3D transformed elements!

Tip:Please use this property together withperspectiveOriginthe property, so that you can change the bottom position of the 3D element.


Browser Support

Internet Explorer Firefox Opera Google Chrome Safari

IE10+ and Firefox support the perspective property.

Chrome, Safari and Opera support another property that can replace this property, the WebkitPerspective property.


Syntax

Return the perspective property:

object.style.perspective

Set the perspective property:

object.style.perspective="length|none"

Property Values

Value Description
length The distance of the element from the view, in pixels.
none Default value. Same as 0. No perspective is set.
initial Sets this property to its default value. Seeinitial。
inherit Inherits this property from its parent element. Seeinherit。

Technical Details

Default value: none
Return value: A string representing the perspective property of the element.
CSS Version CSS3


Related Articles

JavaScript Style Object:perspectiveOrigin Property

CSS Reference:perspective Property


Style 对象参考手册Style Object

Other Extensions