rotate、translate是以元素的几何中心点作为原点进行转换的?

rotate、translate是以元素的几何中心点作为原点进行转换的?

那为何在视频中老师说是以元素的左上角作为原点进行变换的?

http://img1.sycdn.imooc.com/climg//58bce2b20001798306710490.jpg

http://img1.sycdn.imooc.com/climg//58bce2b20001816311190292.jpg


正在回答

登陆购买课程后可参与讨论,去登陆

2回答

 默认情况下,变形的原点在元素的中心点,或者是元素X轴和Y轴的50%。但是针对于translate()有两种理解方法,相对比较严格一点来理解translate()变形的原点在元素的中心点,但是另外一种直观的理解是translate()变形原点根据左(X轴)和顶部(Y轴)位置给定的参数(即左上角),从当前元素位置移动。两者之间并不冲突。只是为了不同的受众群体来理解。

祝学习愉快~

  • 哦,原来是这样,transform属性原点默认都是在中心点的。只是translate()方法无论原点设到哪,都是一样的效果了。
    2017-03-11 18:14:16
慕尼黑6819948 2017-03-06 13:20:58

rotate默认是以元素中心点为原点旋转。

translate默认是以元素左上角为原点偏移。

我是这样理解的。

问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
HTML5与CSS3实现动态网页 2018
  • 参与学习       1887    人
  • 提交作业       4643    份
  • 解答问题       5760    个

有HTML和CSS基础,却不知道如何进阶?本路径带你通过系统学习,完成从“会做网页”到“做出好的动态网页”的蜕变,迈出成为前端工程师的第一步。

了解课程
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师