css3是不是只能实现一次动画

今天小编给大家分享一下css3是不是只能实现一次动画的相关知识点，内容详细，逻辑清晰，相信大部分人都还太了解这方面的知识，所以分享这篇文章给大家参考一下，希望大家阅读完这篇文章后有所收获，下面我们一起来了解一下吧。

创新互联制作网站网页找三站合一网站制作公司,专注于网页设计,成都网站制作、成都网站建设、外贸营销网站建设,网站设计,企业网站搭建,网站开发,建网站业务,680元做网站,已为上千服务,创新互联网站建设将一如既往的为我们的客户提供最优质的网站建设、网络营销推广服务!

css3不是只能实现一次动画；可利用“animation-iteration-count”属性来定义动画播放的次数，当属性值设置为infinite时，播放次数为无限次，语法为“animation-iteration-count:播放次数”。

本教程操作环境：windows10系统、CSS3&&HTML5版、Dell G3电脑。

css3只能实现一次动画吗

css3不是只能实现一次动画。

利用animation-iteration-count即可。

animation-iteration-count属性定义动画应该播放多少次。默认值为一。

语法

animation-iteration-count: value;

n 一个数字，定义应该播放多少次动画
infinite 指定动画应该播放无限次（永远）

示例如下：

<html>
<head>
<meta charset="utf-8"> 
<title>123</title> 
<style> 
div
{
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><strong>注意：</strong> Internet Explorer 9 及更早 IE 版本浏览器不支持 animation-iteration-count 属性。</p>
<div></div>
</body>
</html>

输出结果：

css3是不是只能实现一次动画

以上就是“css3是不是只能实现一次动画”这篇文章的所有内容，感谢各位的阅读！相信大家阅读完这篇文章都有很大的收获，小编每天都会为大家更新不同的知识，如果还想学习更多的知识，请关注创新互联行业资讯频道。

网站标题：css3是不是只能实现一次动画
文章出自：https://www.cdcxhl.com/article18/iispdp.html

成都网站建设公司_创新互联，为您提供动态网站、响应式网站、软件开发、营销型网站建设、网站制作、电子商务

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容