在对scale(-1,1)以后为什么translate(-25px,0)的方向会向右?

在对scale(-1,1)以后为什么translate(-25px,0)的方向会向右?

难道说水平翻转后连坐标轴的X,Y正负方向都进行翻转的了吗???而且rotate(10deg)也变成逆时针转动了,这个是为什么啊?

.ear {

width: 16px;

height: 70px;

background: var(--hl);

border-radius: 50%;

position: absolute;

left: 50%;

top: 30px;

z-index: 0;

transform-origin: 50% 0;

transform: translate(-42px,0) rotate(10deg);

}

.ear.right {

transform: scale(-1,1) translate(-25px,0) rotate(10deg);

}


正在回答 回答被采纳积分+1

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

2回答
小丸子爱吃菜 2017-10-16 10:52:16

scale(x,y) 对元素进行缩放,X表示水平方向缩放的倍数 | Y表示垂直方向的缩放倍数。如果参数是负数,先翻转元素然后再缩放。

祝学习愉快!


  • 提问者 慕田峪5928195 #1
    同时也就改变了这个元素的坐标轴方向了。嗯,应该是这样子。
    2017-10-16 10:54:22
好帮手慕糖 2017-10-15 19:17:20

你好,这有部分代码不能确定问题,建议:将你的全部代码都粘贴过来哟

祝学习愉快~

  • 提问者 慕田峪5928195 #1
    我的意思就是对元素进行scale(-1,1),这样的水平翻转后,同时也把这个元素的坐标轴的x轴的方向也改变了,本来向右是x轴的正方向,变成了向左是x轴的正方向了,这个有什么说法啊?
    2017-10-15 19:39:31
问题已解决,确定采纳
还有疑问,暂不采纳

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

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

0 星
响应式开发与常用框架 2018
  • 参与学习           人
  • 提交作业       2198    份
  • 解答问题       5012    个

如果你有web端基础,既想进阶,又想进军移动端开发,那就来吧,我们专题为你带来的课程有HTML5、CSS3、移动基础、响应式、bootstrap、less等,让你在前端道路上畅通无阻!

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

在线咨询

领取优惠

免费试听

领取大纲

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