admin管理员组

文章数量:1565791

转载自：http://www.softwhy/article-919-1.html

建议首先阅读CSS3 perspective一章节， 下面进入正题。

perspective-origin属性设置perspective属性源点的角度。

关于transform变换更多内容可以参阅CSS3 2D/3D转换一章节。

语法结构 


 
 
  
  
perspective-origin: x-axis y-axis;

参数解析:

（1）.x-axis:定义视图在x轴上的位置。默认值是50%；可以是left、center、right、length和%形式。

（2）.y-axis:定义视图在y轴上的位置。默认值是50%；可以是left、center、right、length和%形式。

可能的参数值形式:left、center、right、length和%。

看了上面的介绍可能还是不够清晰，没有能在大脑中形成一个清晰的概念，那么看下面这张图片:

下面对以上图片做一下简单介绍:

（1）.灰色部分就是我们要看的物体。

（2）.橘红色部分就是perspective属性设置的查看位置。

（3）.红色中心点就是默认的perspective-origin属性值所在位置。

观察物体的时候，并非都是从中心点看过去，可能要换个角度，那么就可以沿着x轴或者y轴更换一个角度。

如果上面说的还不够清楚，再来看下面的图:

上面的图片表示默认的观看角度，下面调整一下角度:

上面的图片向上提高了一下坐标，这样应该比较清晰了。

本文标签： perspectiveOrigin

版权声明：本文标题：CSS3 perspective-origin 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：https://www.elefans.com/dongtai/1725896467a1047703.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。