Can CSS3 create 3D effects?

css3 can create 3D effects. Method: 1. Use the rotateX() method, which can set the element to rotate around the X-axis of a given degree. The syntax is "Element {transform: rotateX (rotate around the X-axis by the number of degrees);}"; 2. Use rotateY( ) method, which can set the element to be rotated around the Y-axis at a given degree. The syntax is "Element {transform: rotateY (rotate around the Y-axis by the number of degrees);}".

The operating environment of this tutorial: Windows 10 system, CSS3&&HTML5 version, Dell G3 computer.

css3 for 3D effects

CSS3 allows you to use 3D transformations to format elements.

3D conversion method:

rotateX()

rotateX() method, rotates an element around its X-axis at a given degree.

The example is as follows:

 
 




注意: Internet Explorer 9 (以及更早版本的浏览器) 和 Opera 不支持 rotateX 方法.
Hello. This is a DIV element.
Hello. This is a DIV element.

Output result:

##rotateY()

 
 




注意: Internet Explorer 9 (以及更早版本的浏览器) 和 Opera 不支持 rotateY方法.
Hello. This is a DIV element.
Hello. This is a DIV element.

css video tutorial,html video tutorial)

The above is the detailed content of Can CSS3 create 3D effects?. For more information, please follow other related articles on the PHP Chinese website!