下面是我运行CSS动画的代码。有了这段代码，这个人可以很好地弹跳。
<!DOCTYPE html>
<html>
<svg xmlns="http://www.w3.org/2000/svg" width="1166" height="693" viewBox="0 0 1166 693">
<style type="text/css">
<![CDATA[
.man {
fill: #D75A4A;
stroke: #fff;
animation: move1 4s 1s infinite ease-out alternate, move2 2s 1 forwards;
transform-origin: 50%;
transition: all 0.5s;
}
@keyframes move1 {
0% {
transform: translateY(-80px);
}
100% {
transform: translateY(20px);
}
}
]]>
</style>
<title>Untitled-2</title>
<g class="man" data-name="Layer 1">
<g>
<path d="M340.16,648.65c6.43,0,6.44-10,0-10s-6.45,10,0,10Z" transform="translate(-18 -15)"/>
<path d="M339.71,647a209.88,209.88,0,0,1,1.65,29.11,1.5,1.5,0,0,0,3,0A209.88,209.88,0,0,0,342.71,647c-.23-1.89-3.24-1.91-3,0Z" transform="translate(-18 -15)"/>
<path d="M338.81,654.86c-.12-.26.07.23.09.29s.06.26.08.39c-.06-.42-.06.77,0,.35a6.84,6.84,0,0,1-.23.89c0,.06-.17.42-.05.15l-.18.38a24.79,24.79,0,0,1-2.38,3.47c-1.67,2.22-3.49,4.93-2.46,7.83a1.55,1.55,0,0,0,1.85,1,1.52,1.52,0,0,0,1.05-1.85,3.24,3.24,0,0,1-.16-.53c-.11-.4,0,.27,0-.14a4.51,4.51,0,0,1,0-.52c0-.08.07-.46,0-.13a4.13,4.13,0,0,1,.58-1.59,27.91,27.91,0,0,1,2.43-3.49c1.79-2.39,3.36-5.08,2-8.06a1.51,1.51,0,0,0-2-.54,1.53,1.53,0,0,0-.54,2.05Z" transform="translate(-18 -15)"/>
<path d="M339.49,660.33a8.84,8.84,0,0,1,1.26,0l.37,0c.17,0,.11,0,0,0l.61.11a10.42,10.42,0,0,1,1.21.35s.42.18.1,0l.23.1.62.32a5.84,5.84,0,0,1,.53.33l.26.18s.31.23.16.1.14.13.14.12l.23.21a6.25,6.25,0,0,1,.45.44,4.69,4.69,0,0,1,.42.47c.09.1.16.21,0,0l.18.25a8.69,8.69,0,0,1,.65,1.15,1.51,1.51,0,0,0,2.06.53,1.53,1.53,0,0,0,.53-2,10.34,10.34,0,0,0-10-5.68,1.54,1.54,0,0,0-1.5,1.5,1.52,1.52,0,0,0,1.5,1.5Z" transform="translate(-18 -15)"/>
<path d="M340,651.6v4.63a1.5,1.5,0,0,0,3,0V651.6a1.5,1.5,0,0,0-3,0Z" transform="translate(-18 -15)"/>
<path d="M342.15,667a1.5,1.5,0,0,0,0-3,1.5,1.5,0,0,0,0,3Z" transform="translate(-18 -15)"/>
</g>
</g>
<g class="backgroundrect" data-name="Layer 2">
<rect x="0.5" y="0.5" width="1165" height="692" fill="none" stroke="#000" stroke-miterlimit="10"/>
<path class= "country1" d="M160.29,149.88c2.78,6.28,6.11,12.63,11.61,16.72,7,5.2,16.21,5.91,24.9,6.36,9.79.51,19.74.92,29.27-1.37s18.75-7.66,23.5-16.23c4.46-8,4.46-18,1.7-26.77s-8.07-16.52-13.83-23.67c-3.71-4.6-7.86-9.17-13.35-11.33-4-1.6-8.5-1.75-12.85-1.76a222.09,222.09,0,0,0-24.19,1.29c-12.36,1.35-29.83,4.85-36,17.44C145.79,121.19,155.92,140,160.29,149.88Z" transform="translate(-18 -15)" fill="none" stroke="#000" stroke-miterlimit="10"/>
<path class="country2" d="M437.53,109.14c3.41,0,6.92,0,10.08,1.27,3.75,1.5,6.59,4.6,9.3,7.6,6,6.72,12.32,13.84,14.41,22.65,1.21,5.11.91,10.45.6,15.7a9.53,9.53,0,0,1-1,4.52,9.06,9.06,0,0,1-3.91,3c-16.74,8.24-35.67,11-54.31,11.83-6.47.3-13.35.29-18.87-3.09-6.15-3.76-9.29-10.88-11.52-17.73a134.13,134.13,0,0,1-6.56-41.12,4.57,4.57,0,0,1,.85-3.27,4.4,4.4,0,0,1,2.56-1.06c8.28-1.38,17,.31,25.38-.16C415.46,108.68,426.57,109.17,437.53,109.14Z" transform="translate(-18 -15)" fill="none" stroke="#000" stroke-miterlimit="10"/>
<path class="country3" d="M630.1,161c.78,11.94,3.87,24.22,11.66,33.31,9.41,11,24.18,15.72,38.44,18.18,15.28,2.64,31.45,3.15,45.86-2.59,19.55-7.79,33.77-27.49,35-48.5s-10.59-42.24-29.1-52.26c-15.76-8.53-34.51-9-52.44-9-10.54,0-21.31.1-31.24,3.64-9.51,3.39-19.87,10.72-19.5,21.57C629.17,137,629.33,149.24,630.1,161Z" transform="translate(-18 -15)" fill="none" stroke="#000" stroke-miterlimit="10"/>
<path class= "country4" d="M411.78,284.2a215.15,215.15,0,0,1,46.69-24.4c16.32-6.12,33.68-10.27,51.07-9.2s34.89,7.81,46.57,20.74c13.71,15.17,17.86,36.51,20.3,56.81.89,7.33,1.47,15.33-2.55,21.52-3.29,5.05-9,7.87-14.46,10.45l-60.25,28.54c-34.58,16.39-71.62,33.2-109.57,28.24-5.84-.76-11.79-2.11-16.64-5.45-5-3.45-8.46-8.77-10.95-14.32a61.76,61.76,0,0,1-4.21-36.87c2.12-10.81,7.1-20.82,12-30.69,9.23-18.47,18.68-37.26,33-52.15,3.92-4.08,10.71-7.86,14.64-3.79,2,2,3.24,5.94,6,5.29" transform="translate(-18 -15)" fill="none" stroke="#000" stroke-miterlimit="10"/>
<path classs="country5" d="M126.85,353.52c-10,12.32-20.09,25.37-23.89,40.81s.31,33.95,13.7,42.51a38.66,38.66,0,0,0,16.93,5.44c20.31,2.11,40.6-6.93,55.92-20.44s26.34-31.17,36.25-49c10.32-18.6,19.86-38.41,21-59.64.44-7.91-.36-16.05-3.69-23.24-4.82-10.37-15.33-17.32-26.44-19.21-12.85-2.19-17.67,2.47-26,11.12C168.55,305,147.11,328.69,126.85,353.52Z" transform="translate(-18 -15)" fill="none" stroke="#000" stroke-miterlimit="10"/>
<path class="country6" d="M723.66,390.08c4.28,1,8.63,2.29,12.16,4.93,4.08,3.05,6.69,7.68,8.7,12.37,6.57,15.28,8,32.25,8.46,48.88s-.3,34.17-9.87,47.62l-50.56.09a12.62,12.62,0,0,1-5.64-.85c-2.06-1-3.4-3.05-4.49-5.06-6-11.19-7.29-24.26-11-36.41-3.81-12.36-10.24-23.89-12.77-36.57-2.6-13,.42-31.6,14-37.87S710,386.8,723.66,390.08Z" transform="translate(-18 -15)" fill="none" stroke="#000" stroke-miterlimit="10"/>
</g>
</svg>
</html>
我最初想到的是让该人在关键帧move1上弹跳两次，然后创建另一个关键帧作为move2，该关键帧将在move1之后启动，然后将该人向上移动（平移Y）。为此，这就是我想出的
<!DOCTYPE html>
<html>
<svg xmlns="http://www.w3.org/2000/svg" width="1166" height="693" viewBox="0 0 1166 693">
<style type="text/css">
<![CDATA[
.man {
fill: #D75A4A;
stroke: #fff;
animation: move1 4s 1s infinite ease-out alternate, move2 2s 1 forwards;
transform-origin: 50%;
transition: all 0.5s;
}
@keyframes move1 {
0% {
transform: translateY(-80px);
}
100% {
transform: translateY(20px);
}
}
@keyframes move2 {
0% {
transform: translateY(20px);
}
100% {
transform: translateY(-320px); opacity:0
}
}
]]>
</style>
<title>Untitled-2</title>
<g class="man" data-name="Layer 1">
<g>
<path d="M340.16,648.65c6.43,0,6.44-10,0-10s-6.45,10,0,10Z" transform="translate(-18 -15)"/>
<path d="M339.71,647a209.88,209.88,0,0,1,1.65,29.11,1.5,1.5,0,0,0,3,0A209.88,209.88,0,0,0,342.71,647c-.23-1.89-3.24-1.91-3,0Z" transform="translate(-18 -15)"/>
<path d="M338.81,654.86c-.12-.26.07.23.09.29s.06.26.08.39c-.06-.42-.06.77,0,.35a6.84,6.84,0,0,1-.23.89c0,.06-.17.42-.05.15l-.18.38a24.79,24.79,0,0,1-2.38,3.47c-1.67,2.22-3.49,4.93-2.46,7.83a1.55,1.55,0,0,0,1.85,1,1.52,1.52,0,0,0,1.05-1.85,3.24,3.24,0,0,1-.16-.53c-.11-.4,0,.27,0-.14a4.51,4.51,0,0,1,0-.52c0-.08.07-.46,0-.13a4.13,4.13,0,0,1,.58-1.59,27.91,27.91,0,0,1,2.43-3.49c1.79-2.39,3.36-5.08,2-8.06a1.51,1.51,0,0,0-2-.54,1.53,1.53,0,0,0-.54,2.05Z" transform="translate(-18 -15)"/>
<path d="M339.49,660.33a8.84,8.84,0,0,1,1.26,0l.37,0c.17,0,.11,0,0,0l.61.11a10.42,10.42,0,0,1,1.21.35s.42.18.1,0l.23.1.62.32a5.84,5.84,0,0,1,.53.33l.26.18s.31.23.16.1.14.13.14.12l.23.21a6.25,6.25,0,0,1,.45.44,4.69,4.69,0,0,1,.42.47c.09.1.16.21,0,0l.18.25a8.69,8.69,0,0,1,.65,1.15,1.51,1.51,0,0,0,2.06.53,1.53,1.53,0,0,0,.53-2,10.34,10.34,0,0,0-10-5.68,1.54,1.54,0,0,0-1.5,1.5,1.52,1.52,0,0,0,1.5,1.5Z" transform="translate(-18 -15)"/>
<path d="M340,651.6v4.63a1.5,1.5,0,0,0,3,0V651.6a1.5,1.5,0,0,0-3,0Z" transform="translate(-18 -15)"/>
<path d="M342.15,667a1.5,1.5,0,0,0,0-3,1.5,1.5,0,0,0,0,3Z" transform="translate(-18 -15)"/>
</g>
</g>
<g class="backgroundrect" data-name="Layer 2">
<rect x="0.5" y="0.5" width="1165" height="692" fill="none" stroke="#000" stroke-miterlimit="10"/>
<path class= "country1" d="M160.29,149.88c2.78,6.28,6.11,12.63,11.61,16.72,7,5.2,16.21,5.91,24.9,6.36,9.79.51,19.74.92,29.27-1.37s18.75-7.66,23.5-16.23c4.46-8,4.46-18,1.7-26.77s-8.07-16.52-13.83-23.67c-3.71-4.6-7.86-9.17-13.35-11.33-4-1.6-8.5-1.75-12.85-1.76a222.09,222.09,0,0,0-24.19,1.29c-12.36,1.35-29.83,4.85-36,17.44C145.79,121.19,155.92,140,160.29,149.88Z" transform="translate(-18 -15)" fill="none" stroke="#000" stroke-miterlimit="10"/>
<path class="country2" d="M437.53,109.14c3.41,0,6.92,0,10.08,1.27,3.75,1.5,6.59,4.6,9.3,7.6,6,6.72,12.32,13.84,14.41,22.65,1.21,5.11.91,10.45.6,15.7a9.53,9.53,0,0,1-1,4.52,9.06,9.06,0,0,1-3.91,3c-16.74,8.24-35.67,11-54.31,11.83-6.47.3-13.35.29-18.87-3.09-6.15-3.76-9.29-10.88-11.52-17.73a134.13,134.13,0,0,1-6.56-41.12,4.57,4.57,0,0,1,.85-3.27,4.4,4.4,0,0,1,2.56-1.06c8.28-1.38,17,.31,25.38-.16C415.46,108.68,426.57,109.17,437.53,109.14Z" transform="translate(-18 -15)" fill="none" stroke="#000" stroke-miterlimit="10"/>
<path class="country3" d="M630.1,161c.78,11.94,3.87,24.22,11.66,33.31,9.41,11,24.18,15.72,38.44,18.18,15.28,2.64,31.45,3.15,45.86-2.59,19.55-7.79,33.77-27.49,35-48.5s-10.59-42.24-29.1-52.26c-15.76-8.53-34.51-9-52.44-9-10.54,0-21.31.1-31.24,3.64-9.51,3.39-19.87,10.72-19.5,21.57C629.17,137,629.33,149.24,630.1,161Z" transform="translate(-18 -15)" fill="none" stroke="#000" stroke-miterlimit="10"/>
<path class= "country4" d="M411.78,284.2a215.15,215.15,0,0,1,46.69-24.4c16.32-6.12,33.68-10.27,51.07-9.2s34.89,7.81,46.57,20.74c13.71,15.17,17.86,36.51,20.3,56.81.89,7.33,1.47,15.33-2.55,21.52-3.29,5.05-9,7.87-14.46,10.45l-60.25,28.54c-34.58,16.39-71.62,33.2-109.57,28.24-5.84-.76-11.79-2.11-16.64-5.45-5-3.45-8.46-8.77-10.95-14.32a61.76,61.76,0,0,1-4.21-36.87c2.12-10.81,7.1-20.82,12-30.69,9.23-18.47,18.68-37.26,33-52.15,3.92-4.08,10.71-7.86,14.64-3.79,2,2,3.24,5.94,6,5.29" transform="translate(-18 -15)" fill="none" stroke="#000" stroke-miterlimit="10"/>
<path classs="country5" d="M126.85,353.52c-10,12.32-20.09,25.37-23.89,40.81s.31,33.95,13.7,42.51a38.66,38.66,0,0,0,16.93,5.44c20.31,2.11,40.6-6.93,55.92-20.44s26.34-31.17,36.25-49c10.32-18.6,19.86-38.41,21-59.64.44-7.91-.36-16.05-3.69-23.24-4.82-10.37-15.33-17.32-26.44-19.21-12.85-2.19-17.67,2.47-26,11.12C168.55,305,147.11,328.69,126.85,353.52Z" transform="translate(-18 -15)" fill="none" stroke="#000" stroke-miterlimit="10"/>
<path class="country6" d="M723.66,390.08c4.28,1,8.63,2.29,12.16,4.93,4.08,3.05,6.69,7.68,8.7,12.37,6.57,15.28,8,32.25,8.46,48.88s-.3,34.17-9.87,47.62l-50.56.09a12.62,12.62,0,0,1-5.64-.85c-2.06-1-3.4-3.05-4.49-5.06-6-11.19-7.29-24.26-11-36.41-3.81-12.36-10.24-23.89-12.77-36.57-2.6-13,.42-31.6,14-37.87S710,386.8,723.66,390.08Z" transform="translate(-18 -15)" fill="none" stroke="#000" stroke-miterlimit="10"/>
</g>
</svg>
</html>
但是它并没有按照我的想法进行。如果有人可以告诉我需要做什么，那将很棒。我是CSS和动画的新手。
谢谢。