理论知识不扎实，可以在一定程度上体现你解决问题的能力。今天我们就以CSS3动画为例，简单回忆一下他的一些基本属性，这些基本属性我们在正常应用中经常使用。
常用动画属性：
transform:translate(x,y);//平移，x代表向下移动距离，y代表向下移动距离；
transform:scale(x,y);//缩放，x代表水平缩放倍数，y代表垂直缩放倍数；
transform:rotate(x);//旋转，x代表顺时针旋转多少度，如rotate(10deg) ；
transform:skew(x,y);//倾斜，x\y分别代表x轴和y轴的倾斜动画过渡。
transition-Property列出了元素应该过渡的CSS属性，可以包括背景、边框和方框模型属性：
transition-duration设置过渡持续时间
transition-timing-function设置过渡速度，ease是可用的、linear、ease-in、ease-out或ease-in-out之一
transition-delay动画延迟时间
缩写形式：
#selector{transition:transform 0.2s ease}
值的顺序必须是以下顺序： transition-property transition-duration transition-function transition-delay
实例展示：
CSS代码：CSS3转换和过渡图中的黄线圈是过渡代码的一部分。相应的动画设置在1s内完成。绿色框架是转换效果，这意味着当鼠标移动到h1标题时，文本将扩展2.5倍。
总之，掌握动画的基本知识是多么重要。模仿别人的动画后，学会吸收别人案例的精髓，为自己使用。
评论0