为了账号安全,请及时绑定邮箱和手机立即绑定

tranform-origin在3D中改变的到底是什么?

tranform-origin在2D变化中我知道改变的是元素的旋转点,是基于元素本身的盒子。比如50% 50%是元素盒子的中点。但是在3D变化中,50% 50%还是元素盒子的中点吗?不是了吧?我看http://www.runoob.com/try/try.php?filename=trycss3_transform-origin_3d_inuse例子,如果是元素盒子中点,那rotateY旋转时中心点应该不动,而实际上是绕着浏览器的Y轴旋转了。不知道我说清楚了没有,请大家指点我一下

正在回答

2 回答

上面草率的回答有误,经过自己的实践发现,transform-origin在3d旋转中起着确定x轴、y轴的作用。transform-origin:value1 value2;则value1(x轴不动时与y轴交点的x值,即y轴可移动)决定了y轴的位置,默认为50%,元素中心竖线。value2同理,决定了x轴的位置。通过改变两个值,旋转正方体即可验证。

1 回复 有任何疑惑可以回复我~

2d变换因为是平面的,可以有旋转中心。而3d变化中,是以轴为参考的,实现任意旋转是通过绕x轴、y轴和z轴这三个子效果实现的。因为你要实现任意旋转,3d旋转的旋转中心是很难找的,或者不存在,你能说出一个div绕x轴旋转90度,它的旋转中心在哪吗。所以我个人认为transform在3d旋转中没用,在3d缩放中应该有用,可自己试试看!不必纠结这个问题了

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

tranform-origin在3D中改变的到底是什么?

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信