animation-duration属性有什么用

　　CSS3animation-duration属性

　　作用：animation-duration属性定义动画完成一个周期所需要的时间，以秒或毫秒计。

　　语法：

　　animation-duration:time

　　time：规定完成动画所花费的时间。默认值是0，意味着没有动画效果。

　　注：InternetExplorer9以及更早的版本不支持animation-duration属性。

　　CSS3animation-duration属性的使用示例

　　<!DOCTYPEhtml>

　　<html>

　　<head>

　　<style>

　　div

　　{

　　width:100px;

　　height:100px;

　　background:red;

　　position:relative;

　　animation:mymoveinfinite;

　　animation-duration:2s;

　　/*SafariandChrome*/

　　-webkit-animation:mymoveinfinite;

　　-webkit-animation-duration:2s;

　　}

　　@keyframesmymove

　　{

　　from{top:0px;}

　　to{top:200px;}

　　}

　　@-webkit-keyframesmymove/*SafariandChrome*/

　　{

　　from{top:0px;}

　　to{top:200px;}

　　}

　　</style>

　　</head>

　　<body>

　　<p><strong>注：</strong>InternetExplorer9以及更早的版本不支持animation-name属性。</p>

　　<p><b>注：</b>始终规定animation-duration属性，否则时长为0，就不会播放动画了。</p>

　　</body>

　　</html>

本文转载自中文网

如需转载，请注明文章出处和来源网址：http://www.divcss5.com/css3-style/c56270.shtml