网布就是我们的屏幕,x轴沿屏幕平行的水平方向,y轴沿屏幕平行的垂直方向,z轴沿与屏幕垂直方向。
rotateX(angle), rotateY(angle), rotateZ(angle), rotate3d(x, y, z, angle)
为什么我旋转了之后没有出现矩形效果呢?更近的地方不应该看起来更大吗?非常好的问题,说明你思考了,这里我们漏了一个很重要的因素,设定3D环境 perspective
;在没有设定视距条件下,会被默认为视距无穷远,因此旋转得到的微弱的梯形效果也就忽略了
.rotate3d {
background: lightgreen;
transform: perspective(100px) rotate3d(1,0,-1,30deg);
}