transform
是静态属性,设置了就会立马生效,比如给容器设置 transform: scale(0.8) , 渲染的时候会直接使容器变小
具体用法 https://www.runoob.com/cssref/css3-pr-transform.html
transition
transition
属性是一个简写属性,用于设置四个过渡属性:
- transition-property
- transition-duration
- transition-timing-function
- transition-delay
设置时不会立马生效,当容器某个属性变化时,才会触发该过渡效果
比如设置 transition: all 0.3 ease-in 0,该容器的宽度从 100px 到 200px,然后会触发该过渡效果,不会立马从 100px 跳到 200px,属于 animation
的简版
具体用法 https://www.runoob.com/cssref/css3-pr-transition.html
animation
这个很好区分,相信大家用的也比较多,不解释,看文档 https://www.runoob.com/cssref/css3-pr-animation.html