Course Recommendation:

Style perspective property

Note: When the Definition and Usage

property, it defines the distance of the 3D element from the view in pixels. This property allows you to change the viewing angle of the 3D element. Note: When the When defining the

property is defined, its child elements will get the perspective effect, not the element itself.Note: When the perspective

This property only affects 3D transform elements.Tip: perspective-origin property Use this property together with others so that you can change the bottom position of 3D elements.

See also:

JavaScript Style Object:perspectiveOrigin property

CSS Reference Manual:perspective property

Example

Set the viewing angle of the element:

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

Try it yourself

Syntax

Return perspective property:

object.style.perspective

Set perspective property:

object.style.perspective = "length|none"

Property Value

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

Technical Details

Default value: None
Return value: A string that represents the element's perspective property.
CSS Version: CSS3

Browser Support

The numbers in the table indicate the version of the browser that first fully supports this property.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
36.0 10.0 16.0 6.1 23.0