本帖最后由 花简静 于 2024-7-25 18:50 编辑
<style>
#mama {
position: relative;
margin: 130px 0 30px calc(50% - 931px);
width: 1700px;
height: 900px;
background: url('https://642303.freep.cn/642303/tu/fgji5.webp') no-repeat center/cover;
}
#mypic {
position: absolute;
left: 20px;
top: 240px;
width: 180px;
height: 180px;
animation: rot 8s linear 6; /* 时长为8秒 匀速 运行6次 */
}
@keyframes rot {
from { left: 880px; } /* 从 左距880px开始 */
to { left: 10px; } /* 到 左距10px结束 */
}
</style>
<div id="mama">
<img id="mypic" alt="" src="https://642303.freep.cn/642303/za/xiaotu06080603.png" />
</div>
|