CSS3 过渡
1.transition 简写属性,用于在一个属性中设置四个过渡属性。
2.transition-property 规定应用过渡的 CSS 属性的名称。
3.transition-duration 定义过渡效果花费的时间。默认是 0。
4.transition-timing-function 规定过渡效果的时间曲线。默认是 "ease"。
5.transition-delay 规定过渡效果何时开始。默认是 0。
CSS3 动画
1.@keyframes 规定动画。
2.animation 所有动画属性的简写属性,除了 animation-play-state 属性。
3.animation-name 规定 @keyframes 动画的名称。
4.animation-duration 规定动画完成一个周期所花费的秒或毫秒。默认是 0。
5.animation-timing-function 规定动画的速度曲线。默认是 "ease"。
6.animation-delay 规定动画何时开始。默认是 0。
7.animation-iteration-count 规定动画被播放的次数。默认是 1。
8.animation-direction 规定动画是否在下一周期逆向地播放。默认是 "normal"。
9.animation-play-state 规定动画是否正在运行或暂停。默认是 "running"。
10.animation-fill-mode 规定对象动画时间之外的状态。
总结 :
####1.通过 CSS3,我们可以在不使用 Flash 动画或 JavaScript 的情况下,当元素从一种样式变换为另一种样式时为元素添加效果。(要实现这一点,我们需要规定效果添加到哪个CSS属性上以及效果时长 )
2.通过 CSS3,我们能够创建动画,这可以在许多网页中取代动画图片、Flash 动画以及 JavaScript。(要实现这一效果,我们需要了解@keyframes 规则,用于创建动画。在 @keyframes 中规定某项 CSS 样式,就能创建由当前样式逐渐改为新样式的动画效果。)