animation-duration

版本：CSS3

animation-duration属性指定一个动画周期的时长。默认值为0s，表示无动画。使用简写属性animation很方便地同时设置所有的动画属性。

示例

animation-duration: 6s
animation-duration: 120ms
animation-duration: 1s, 15s
animation-duration: 10s, 30s, 230ms

浏览器支持

语法

取值：

• 一个动画周期的时长，单位为秒(s)或者毫秒(ms)，无单位值无效。

注意：负值无效，浏览器会忽略该声明，但是一些早起的带前缀的声明会将负值当作0s。

实例

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;}
} 

效果图：

鹏仔微信 15129739599 鹏仔QQ344225443 鹏仔前端 pjxi.com 共享博客 sharedbk.com