首页 > 开发 > CSS > 正文

css3中的变形和动画 (上)

2016-05-18 19:09:42  来源:慕课网
  1:旋转 transform:rotate(45deg); -webkit-transform:rotate(45deg)
正值表示顺时针,复制表示逆时针
2:变形 skew()两个值,X和Y轴进行倾斜。
3:缩放 scake(),一个值,按倍数缩放
4:位移transform()两个值,px为单位
5:transform-origin 改变中心点,
6:animation 动画 名字(name)(持续时间) (动画过程)(延迟时间)(播放次数)/infinite 无线播放
7:设置动画时间外属性 animation-fill-mode:forwards;
  none 默认值,表示动画将按预期进行和结束,在动画完成其最后一帧时,动画会反转到初始帧处
  forwards 表示动画在结束后继续应用最后的关键帧的位置
  backwards 会在向元素应用动画样式时迅速应用动画的初始帧
  both 元素动画同时具有forwards和backwards效果