有了CSS动画，你可以给你的页面元素加入许多互动性（而且是在不用Flash前提下！），配合JavaScript，它甚至可以用来制作网页游戏。 通过应用本文所介绍的12条准则，你可以为你的网站制作出更加逼真可信的动画，从而提升网站的整体用户体验。

CSS动画工具

许多工具可以帮助你制作CSS动画。

Sencha Animator

Adobe Edge

Tumult(mac only)

真实的CSS动画案例

看看真实应用中的CSS动画会让你对它所能实现的效果有更深的影响。

CSS Spider-man animation by Anthony Calzadilla

CSS Tricks (animated typography person),by Mircea Piturca

Walking man,by Andrew Hoyer

Learning CSS3: Useful References and Guidelines, on Smashing Magazine

Mastering CSS Principles: A Comprehensive Guide, on Smashing Magazine

译者补充， 下面的代码可以检查用户浏览器是否支持CSS 动画

var animation = false,
     animationstring = 'animation',
     keyframeprefix = '',
     domPrefixes = 'Webkit Moz O ms Khtml'.split(' '),
     pfx = '';

     if( elm.style.animationName ) { animation = true; }

    if( animation === false ) {
         for( var i = 0; i < domPrefixes.length; i++ ) {
            if( elm.style[ domPrefixes[i] + 'AnimationName' ] !==         undefined ) {
             pfx = domPrefixes[ i ];
             animationstring = pfx + 'Animation';
             keyframeprefix = '-' + pfx.toLowerCase() + '-';
             animation = true;
             break;
         }
    }
}