Course Recommendation:

Style perspective property

Note: When the Definition and Usage

property 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 receive 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 to 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 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: A string representing the element's perspective property.
CSS Version: CSS3

Browser Support

The numbers in the table indicate the first browser version to fully support this property.

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