3D转换之三维坐标系,透视旋转等基础知识

本文介绍了三维坐标系的构成,包括x、y、z轴的定义;接着讲解了透视概念,如何模拟人类视觉的3D效果,并通过透视距离产生近大远小的效果;然后详细阐述3D旋转,包括rotateX、rotateY、rotateZ及自定义rotate3d的用法;最后提到了3D呈现的transform-style属性,用于控制子元素是否开启3D立体空间。
摘要由CSDN通过智能技术生成

一.三维坐标系

   三维坐标系就是指立体空间,立体空间是由3个轴共同组成的。

1.x轴:水平向右    注意:x右边是正值,左边是负值

2.y轴:垂直向下    注意:y下面是正值,上面是负值

3.z轴:垂直屏幕    注意:往外面是正值,往里面是负值

二.透视  perspective

在2D平面产生近大远小视觉立体,但是效果是二维的

1.如果想要在网页产生3D效果需要透视(理解成3D物体投影在2D平面内)

2.模拟人类的视觉位置,可以安排一只眼睛去看

    透视我们也称为视距:视距就是人眼睛到屏幕的距离

     距离视觉点越近的在电脑平面成像越大,越远成像越小

3.透视的单位是像素

透视写在被观察元素的父盒子上

d:就是视距

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值