Shulou(Shulou.com)06/01 Report--

This article mainly introduces how to use the perspective attribute in css. It is very detailed and has a certain reference value. Friends who are interested must finish it!

CSS3perspective attribute

What it does: the perspective attribute defines the distance of the 3D element from the view, in pixels. This attribute allows you to change the 3D element to see the view of the 3D element. When you define a perspective attribute for an element, its child elements get perspective, not the element itself.

Note: the perspective attribute only affects 3D conversion elements.

Syntax:

Perspective:number | none

Number: the distance of the element from the view, in pixels.

None: default value. Same as 0. Do not set perspective.

Description: this attribute should be used with the perspective-origin attribute so that the bottom position of the 3D element can be changed.

An example of using the CSS3perspective attribute

# div1

{

Position:relative

Height:150px

Width:150px

Margin:50px

Padding:10px

Border:1pxsolidblack

Perspective:150

-webkit-perspective:150;/*SafariandChrome*/

}

# div2

{

Padding:50px

Position:absolute

Border:1pxsolidblack

Background-color:yellow

Transform:rotateX (45deg)

-webkit-transform:rotateX (45deg); / * SafariandChrome*/

}

HELLO

The above is all the content of the article "how to use the perspective attribute in css". Thank you for reading! Hope to share the content to help you, more related knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.