在CSS动画中使用motion-path

使用motion path，作者可以让图像物体按照指定的路径运动。谷歌浏览器积极的要实现这个CSS特征，我想主要motion-path是SVG动画里独特的亮点，而谷歌浏览器已经决定放弃SVG SMIL，所以，实现了CSS中的motion-path，也就能很好的说服哪些喜欢SVG动画的用户了。

CSS里的motion-path预防是这样的：

motion-path: path(\'M100,250 C 100,50 400,50 400,250\');

下面是三个在CSS里使用motion-path的实例演示。

注意：目前只有谷歌浏览器实现了这个功能，请使用最新版的谷歌浏览器观看。

< border=\"0\" height=\"500\" scrolling=\"no\" src=\"http://www.webhek.com/demos/codepens/32.html?height=500\" style=\"width: 100%; overflow: hidden;\">

< border=\"0\" height=\"300\" scrolling=\"no\" src=\"//www.webhek.com/demos/codepens/33.html?height=300\" style=\"width: 100%; overflow: hidden;\">

< border=\"0\" height=\"400\" scrolling=\"no\" src=\"//www.webhek.com/demos/codepens/34.html?height=400\" style=\"width: 100%; overflow: hidden;\">