CSS动画效果无限循环放大缩小

最新推荐文章于 2024-07-02 16:31:14 发布

a_靖

最新推荐文章于 2024-07-02 16:31:14 发布

阅读量7.3k

点赞数 5

本文链接：https://blog.csdn.net/qq_35713752/article/details/114839711

版权

Ant Design Pro 教程专栏同时被 3 个专栏收录

40 篇文章 152 订阅 ¥49.90 ¥99.00

订阅专栏

uniapp框架零基础到开发应用详细教程

23 篇文章 138 订阅 ¥49.90 ¥99.00

订阅专栏

Web前端

404 篇文章 25 订阅

订阅专栏

这篇博客展示了如何使用CSS创建一个无限循环的心跳动画效果，通过不断放大缩小元素来模拟心跳的律动，详细介绍了相关CSS代码及其实现过程。

摘要由CSDN通过智能技术生成

效果图：

CSS动画效果无限循环放大缩小

<image class="anima" mode="widthFix" @click="nav" src="@/static/1_btn.png"></image>


	.anima {
		animation-name: likes; // 动画名称
		animation-direction: alternate; // 动画在奇数次（1、3、5...）正向播放，在偶数次（2、4、6...）反向播放。
		animation-timing-function: linear; // 动画执行方式，linear：匀速；ease：先慢再快后慢；ease-in：由慢速开始；ease-out：由慢速结束；ease-in-out：由慢速开始和结束；
		animation-delay: 0s; // 动画延迟时间
		animation-iteration-count: infinite; //  动画播放次数

了解本专栏