animation-iteration-count属性是用于定义动画播放次数的,设置animation-iteration-count属性的值为infinite,就可实现动画的无限循环播放。
CSS3 animation-iteration-count属性
作用:animation-iteration-count 属性定义动画的播放次数。
语法:
animation-iteration-count: n|infinite;
n:定义动画播放次数的数值。
infinite:规定动画应该无限次播放。
注:Internet Explorer 9 以及更早的版本不支持 animation-iteration-count 属性。
CSS3 animation-iteration-count属性的使用示例
设置动画循环3次
<!DOCTYPE html><html><head><style> p{width:100px;height:100px;background:red;position:relative;animation:mymove 3s;animation-iteration-count:3;/* Safari and Chrome */-webkit-animation:mymove 3s;-webkit-animation-iteration-count:3;}@keyframes mymove{from {top:0px;}to {top:200px;}}@-webkit-keyframes mymove /* Safari and Chrome */{from {top:0px;}to {top:200px;}}</style></head><body><p></p></body></html>
效果图:
免责声明:本站内容仅用于学习参考,信息和图片素材来源于互联网,如内容侵权与违规,请联系我们进行删除,我们将在三个工作日内处理。联系邮箱:chuangshanghai#qq.com(把#换成@)