transform translate transition 的区别

transform是变形,下面有translate

transform: rotate旋转/scale缩放/skew扭曲/translate移动/matrix矩阵变形
transform连写:rotate scale skew translate


translate移动,transform:translateX(10px)/translateY(10px)

transition是平滑过渡动画,用于鼠标单击,获得焦点,对元素触发的时候平滑的过渡动画

transition:all 1s ease 1s;

transition:property duration timing-function delay
transition-property 属性
transition-duration 动画的持续时间
transition-timing-function 动画效果
  ease:逐渐变慢
  linear:匀速
  ease-in:加速
  ease-out:减速
  ease-in-out:先加速后减速
  cubic-bezier:cubic-bezier曲线
transition-delay 等待多长时间开始动画

原文地址:https://www.cnblogs.com/joya0411/p/3664465.html