网页怎么实现图片实时自动放大缩小

如何实现以下效果（动态变化）

浏览页面时当前图片在屏幕上一会儿大一会儿小

要求（能设置变化幅度）（变大变小一直循环）（变化得很丝滑）

用css动画

代码如下：{如果对你有帮助，可以给我个采纳吗，谢谢!! 点击我这个回答右上方的【采纳】按钮}。

<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
	<title> 页面名称 </title>
<style type="text/css">
.box {
	border-radius: 50%;
	width: 100px;
	height: 100px;
	background-color: #00F;
	animation:mymove 5s infinite;
	margin: 50px;
}
@keyframes mymove
{
    0%{
	    transform: scale(1);  /*开始为原始大小*/
    }
    25%{
        transform: scale(1.5); /*放大1.5倍*/
    }
    50%{
        transform: scale(0.8);
    }
    75%{
        transform: scale(1.1);
    }

}
        
</style>
</head>
<body>

<div class="box"></div>


</body>
</html>

处理图片自适应问题没有特定方案，如果使用一些前端框架处理问题相对简单，比如bootstrap有页面自适应，图片也有响应式图片的处理方案

定时器吗

您好，我是有问必答小助手，您的问题已经有小伙伴解答了，您看下是否解决，可以追评进行沟通哦~

如果有您比较满意的答案 / 帮您提供解决思路的答案，可以点击【采纳】按钮，给回答的小伙伴一些鼓励哦～～

ps:问答VIP仅需29元，即可享受5次/月有问必答服务，了解详情>>>https://vip.csdn.net/askvip?utm_source=1146287632