perspective property
Gets or sets a value that represents the perspective from which all child elements of the object are viewed.
This property is read/write.
![]() ![]() |
Syntax
perspective: none |
<number>
Property values
A value that represents the perspective, in pixels, from which to view each child element.
none-
Default. No perspective declared.
- number
-
A floating-point number, followed by a relative units designator ("px"), that indicates the depth of the perspective. For more information about supported length units, see CSS Values and Units.
CSS information
| Applies To | block-level and inline-level elements |
|---|---|
| Media | visual |
| Inherited | no |
| Initial Value | none |
Standards information
- CSS Transforms Module, Level 3, Section 10
Remarks
This property does not affect how the object is rendered.
This property is only applied to child elements that have a transform specified.
The object is the projection plane for the child elements.
This property specifies that each child is rendered relative to the specified perspective, whereas the perspective function of the transform property specifies that each child is rendered from the same perspective.
The following images illustrate the difference between this property and the perspective function of the transform property.


Do not use the Microsoft vendor prefix ("-ms-") before the perspective property. It is supported unprefixed in Internet Explorer 10 and later.
To learn more about Cascading Style Sheets (CSS) transforms in Windows Internet Explorer, see How to bring your webpage to life with CSS transforms, transitions, and animations.
See also
- a
- abbr
- acronym
- address
- b
- bdo
- big
- blockQuote
- br
- button
- cite
- code
- CSSStyleDeclaration
- currentStyle
- dd
- del
- dfn
- div
- dl
- dt
- em
- fieldSet
- form
- i
- img
- input
- ins
- kbd
- label
- li
- map
- noFrames
- noScript
- object
- ol
- p
- pre
- q
- samp
- script
- select
- small
- span
- strong
- style
- sub
- sup
- table
- tBody
- td
- textArea
- tFoot
- th
- tHead
- tr
- tt
- ul
- var
- transform
- How to bring your webpage to life with CSS transforms, transitions, and animations

