animation-duration
版本： CSS3
animation-duration
属性指定一个动画周期的时长。默认值为0s，表示无动画。使用简写属性
animation
很方便地同时设置所有的动画属性。
示例
animation-duration: 6s animation-duration: 120ms animation-duration: 1s, 15s animation-duration: 10s, 30s, 230ms
浏览器支持
|
|
|
|
|
IE10以上版本的浏览器都支持
animation-duration
|
||||
语法
animation-duration : <time>
取值：
-
<time>一个动画周期的时长，单位为秒(s)或者毫秒(ms)，无单位值无效。
注意： 负值无效，浏览器会忽略该声明，但是一些早起的带前缀的声明会将负值当作0s。
| 默认值 | 0s |
| 适用于 |
所有元素，包含伪对象
::before
and
::after
|
| 继承性 | 无 |
| 动画性 | 否 |
| 计算值 | 指定值 |
| 媒体 | 交互 |
实例
<style type="text/css">
div{
width:100px;
height:100px;
position:relative;
background-color:hsl(120,65%,75%);
animation:demo infinite;
-webkit-animation:demo infinite;
animation-duration:5s;
-webkit-animation-duration:5s;
}
@keyframes demo
{
from{left:0px;}
to{left:450px;}
}
/*safari和chrome*/
@-webkit-keyframes demo
{
from{left:0px;}
to{left:450px;}
}
</style>
</head>
<body>
<div></div>
</body>
</html>
效果图：
