(初来乍到,请多指教)

开发工具与关键技术:DW
作者:超级小贱贱
撰写时间:2019年1月16日

分享一下当时困扰了我半天时间才搞明白的改变原点origin相关知识
先举个例子:
transform-origin:left
当初以为就像top right bottom left一样就4个点改变原点位置,后来发现大错特错
根据总结出来的改变原点位置一共有9个,分别是以下元素:

top=top center 50% 0
left=left center 0 50%
bottom=bottom center 50% 100%
center=center center 50% 50%
right=right center 100% 50%
top left=left top 0 0
top right=right top 0 100%
bottom left=left bottom 100% 0
bottom right=right bottom 100% 100%

大家是不是跟我一开始一样,一脸懵逼?其实我给出下面这幅图就一目了然了
关于CSS变形transform中的origin改变原点

而且呢,一开始我看到(0,0)就以为是原点最初的位置,后来发现是(50%,50%)喔
所以请后面那些初学者不要犯了跟我一样的错误!

相关文章:

  • 2022-02-09
  • 2021-08-27
  • 2021-12-07
  • 2022-12-23
  • 2022-12-23
  • 2022-01-07
猜你喜欢
  • 2022-12-23
  • 2021-11-27
  • 2022-12-23
  • 2021-10-24
  • 2022-12-23
  • 2021-06-05
  • 2021-06-14
相关资源
相似解决方案