1.透视的基础认识。
1.如果想要在网页产生3D效果需要透视。
2.透视，我们也称之为视距，视距是人的眼睛到屏幕的距离。
3.距离视觉点越近的在电脑平面成像越大，越远成像越小。
4.透视的单位是像素。
注意：
透视写在被观察元素的父盒子上面
d:就是视距，视距就是一个距离人的眼睛到屏幕的距离。
z:就是 z轴，物体距离屏幕的距离，z轴越大(正值)我们看到的物体就越大
2.案例演示：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <style> body { /* 透视写在被观察元素的父盒子上。 */ perspective: 500px; /* 透视越小表示，离屏幕越近，图像就越大 */ } div { width: 200px; height: 200px; background-color: red; /* transform: translateX(100px) translateY(100px) translateZ(100px); */ /* translateZ表示在y轴上移动 ，且单位通常为px*/ /* 下面这个方式与下面这个方式相同。 */ transform: translate3d(400px, 100px, 100px); /* 其中的x,y,z三者都不能省略，如果想要省略写0就好了。 */ } </style> </head> <body> <div></div> </body> </html>
