简单的Css3效果

					简单的Css3动画效果

开发工具与关键技术：DW中的Css3效果
作者：冉冉
撰写时间：2019年1月17日

Css3有三大属性，分别是：transform，transition，animation。其中transform对旋转，缩放，扭曲，位移都能提供属性支持
transition是实现动画效果的一个属性
animation是用@keyframes规则达到不断变化的效果
我要实现的是transform中的旋转效果和位移效果，transition属性。
下面要实现的是旋转效果：
rotate()；用来设置旋转的度数，（可以是正数也可以是负数，正数代表着顺时针方向，负数代表着逆时针方向；“deg”是单位“度”）
再一个就是位移效果：

translate(X,Y)；用来设置位移的偏移量，X表示的是横坐标，Y表示的是纵坐标。X,Y可以是负数，X：正数向右偏移，负数向左偏移；Y：正数向下偏移，负数则相反
下面来实现transition属性效果：

property：；变化的值（宽度，高度等）；duration：；执行动画的时间；delay：；延迟执行时间；还有其他函数就不一一列举了
在css3中可以实现很多在js中需要很复杂的代码实现的效果，虽然在js中有很多css3实现不了的效果，而我们都想用更简洁的代码来实现更复杂的功能，因为复杂的代码会令一些程序员头疼，简单的代码会使程序员偶尔轻松一下，因此我们也为这个目标一直努力。