拳击小游戏
代码语言：html
所属分类：游戏
代码描述：拳击小游戏
下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
:root {
--mac-y: 45px;
--mac-width: 300px;
--mac-height: 600px;
--hand-y: 200px;
--hand-size: 80px;
--white: #fff;
--green: #39dc43;
--blue: #3dbcfc;
--skin: #ffc5ba;
--black: #000100;
--spit: #cbe8f4;
--pink: #ff6dce;
--light-blue: #49cedf;
--ring: #0557f5;
--ring-aqua: #01818a;
--ring-green: #02A800;
--ring-blue: #0557f5;
}
@media (max-height: 400px) {
:root {
--mac-y: 30px;
--mac-width: 200px;
--mac-height: 400px;
--hand-y: 45%;
--hand-size: 60px;
}
}
* {
box-sizing: border-box;
}
html,
body {
height: 100%;
max-height: -webkit-fill-available;
max-height: -moz-available;
max-height: fill-available;
margin: 0;
}
body {
--hair: var(--black);
--gloves: var(--black);
--tank: var(--black);
--boot: var(--black);
--highlight: var(--green);
--ring: var(--ring-blue);
}
body.theme-minor {
--hair: var(--black);
--gloves: var(--black);
--tank: var(--black);
--boot: var(--black);
--highlight: var(--green);
--ring: var(--ring-blue);
}
body.theme-major {
--hair: var(--black);
--gloves: var(--black);
--tank: var(--black);
--boot: var(--black);
--highlight: var(--blue);
--ring: var(--ring-green);
}
body.theme-world {
--hair: var(--black);
--gloves: var(--black);
--tank: var(--black);
--boot: var(--black);
--highlight: var(--green);
--ring: var(--ring-aqua);
}
.ring {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: var(--ring);
-webkit-transition: background-color 0.4s;
transition: background-color 0.4s;
}
.config {
position: absolute;
width: 100%;
top: 0;
left: 0;
color: var(--white);
font-size: 16px;
padding: 0 10px;
}
.config__title {
display: block;
padding: 10px 10px 10px 0;
text-transform: uppercase;
font-size: 0.85em;
letter-spacing: 0.05em;
}
.config__title::after {
content: ':';
}
.config__option {
display: -webkit-box;
display: flex;
width: 100%;
margin: 10px 0;
-webkit-box-align: center;
align-items: center;
}
.config__label {
display: block;
padding: 10px;
border-radius: 4px;
min-width: 62px;
text-align: center;
}
.config input {
display: inline;
vertical-align: text-top;
width: 0;
height: 0;
position: absolute;
left: -9999px;
}
.config input:checked + .config__label {
background: var(--white);
color: var(--black);
}
.boot {
fill: var(--boot);
}
.tank {
fill: var(--tank);
}
.hair {
fill: var(--hair);
}
.highlight,
.trunk,
.glove {
fill: var(--highlight);
}
.skin {
fill: var(--skin);
}
.spit {
fill: var(--spit);
}
.boot,
.tank,
.hair,
.highlight,
.trunk,
.glove,
.skin,
.spit {
-webkit-transition: fill 0.4s;
transition: fill 0.4s;
}
.touch-controller .hand {
position: absolute;
bottom: var(--hand-y);
width: var(--hand-size);
height: var(--hand-size);
touch-action: none;
-webkit-transition: -webkit-transform 0.2s;
transition: -webkit-transform 0.2s;
transition: transform 0.2s;
transition: transform 0.2s, -webkit-transform 0.2s;
will-change: transform;
z-index: 5;
}
.touch-controller .hand__circle {
display: block;
background-color: #fff;
border-radius: 50%;
width: 100%;
height: 100%;
-webkit-transition: background-color 0.2s;
transition: background-color 0.2s;
pointer-events: none;
}
.touch-controller .hand.left {
left: 40px;
}
.touch-controller .hand.right {
right: 40px;
}
.touch-controller .hand.is-active {
-webkit-transition: none;
transition: none;
}
.touch-controller .hand.is-active .touch-controller .hand__circle {
background-color: var(--highlight);
}
.keyboard-controller .keyboard {
position: absolute;
bottom: 0;
right: 0;
width: 100%;
max-width: 320px;
display: grid;
grid-auto-columns: 1fr;
grid-template-areas: "z x space space space lft up rgt enter" "z x space space space lft down rgt enter";
-webkit-column-gap: 5px;
-moz-column-gap: 5px;
column-gap: 5px;
row-gap: 5px;
padding: 10px;
}
.keyboard-controller .keyboard.keyz .key--z, .keyboard-controller .keyboard.keyx .key--x, .keyboard-controller .keyboard.space .key--space, .keyboard-controller .keyboard.arrowleft .key--lft, .keyboard-controller .keyboard.arrowup .key--up, .keyboard-controller .keyboard.arrowdown .key--down, .keyboard-controller .keyboard.arrowright .key--rgt, .keyboard-controller .keyboard.enter .key--enter {
background-color: var(--highlight);
}
.keyboard-controller .key {
background-color: #fff;
display: -webkit-box;
display: flex;
-webkit-box-pack: center;
justify-content: center;
-webkit-box-align: center;
align-items: center;
border-radius: 4px;
-webkit-transition: background-color 0.2s;
transition: background-color 0.2s;
}
.keyboard-controller .key--z {
grid-area: z;
}
.keyboard-controller .key--x {
grid-area: x;
}
.keyboard-controller .key--space {
grid-area: space;
}
.keyboard-controller .key--lft {
grid-area: lft;
}
.keyboard-controller .key--up {
grid-area: up;
}
.keyboard-controller .key--down {
grid-area: down;
}
.keyboard-controller .key--rgt {
grid-area: rgt;
}
.keyboard-controller .key--enter {
grid-area: enter;
}
.mac {
width: var(--mac-width);
height: var(--mac-height);
position: absolute;
bottom: var(--mac-y);
left: 50%;
-webkit-transform: translate3d(-50%, 0, 0);
transform: translate3d(-50%, 0, 0);
overflow: hidden;
}
.mac.is-tired {
--hair: var(--pink);
--gloves: var(--pink);
--tank: var(--pink);
--boot: var(--pink);
--highlight: var(--light-blue);
}
.mac.is-disable {
--hair: var(--black);
--gloves: var(--black);
--tank: var(--black);
--boot: var(--black);
--highlight: var(--white);
}
.mac__sprite {
width: 100%;
-webkit-animation: idle 0.6s steps(3) infinite alternate;
animation: idle 0.6s steps(3) infinite alternate;
}
.is-tired .mac__sprite {
-webkit-animation: tired 0.4s steps(2) infinite alternate;
animation: tired 0.4s steps(2) infinite alternate;
}
.mac.right {
-webkit-transform: translate3d(-50%, 0, 0) scaleX(-1);
transform: translate3d(-50%, 0, 0) scaleX(-1);
}
.mac.jab .mac__sprite {
-webkit-animation: jab 0.3s steps(3);
animation: jab 0.3s steps(3);
}
.mac.punch .mac__sprite {
-webkit-animation: punch 0.3s steps(3);
animation: punch 0.3s steps(3);
}
.mac.uppercut .mac__sprite {
-webkit-animation: uppercut 0.5s steps(6);
animation: uppercut 0.5s steps(6);
}
.mac.dodge .mac__sprite {
-webkit-animation: dodge 0.2s steps(2);
animation: dodge 0.2s steps(2);
}
.mac.block .mac__sprite {
-webkit-animation: block 0.2s steps(1) forwards;
animation: block 0.2s steps(1) forwards;
}
@-webkit-keyframes idle {
0% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
100% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-3), 0);
transform: translate3d(0, calc(var(--mac-height)*-3), 0);
}
}
@keyframes idle {
0% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
100% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-3), 0);
transform: translate3d(0, calc(var(--mac-height)*-3), 0);
}
}
@-webkit-keyframes jab {
0% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-3), 0);
transform: translate3d(0, calc(var(--mac-height)*-3), 0);
}
100% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-6), 0);
transform: translate3d(0, calc(var(--mac-height)*-6), 0);
}
}
@keyframes jab {
0% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-3), 0);
transform: translate3d(0, calc(var(--mac-height)*-3), 0);
}
100% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-6), 0);
transform: translate3d(0, calc(var(--mac-height)*-6), 0);
}
}
@-webkit-keyframes punch {
0% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-6), 0);
transform: translate3d(0, calc(var(--mac-height)*-6), 0);
}
100% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-9), 0);
transform: translate3d(0, calc(var(--mac-height)*-9), 0);
}
}
@keyframes punch {
0% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-6), 0);
transform: translate3d(0, calc(var(--mac-height)*-6), 0);
}
100% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-9), 0);
transform: translate3d(0, calc(var(--mac-height)*-9), 0);
}
}
@-webkit-keyframes uppercut {
0% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-9), 0);
transform: translate3d(0, calc(var(--mac-height)*-9), 0);
}
100% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-15), 0);
transform: translate3d(0, calc(var(--mac-height)*-15), 0);
}
}
@keyframes uppercut {
0% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-9), 0);
transform: translate3d(0, calc(var(--mac-height)*-9), 0);
}
100% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-15), 0);
transform: translate3d(0, calc(var(--mac-height)*-15), 0);
}
}
@-webkit-keyframes dodge {
0% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-15), 0);
transform: translate3d(0, calc(var(--mac-height)*-15), 0);
}
100% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-17), 0);
transform: translate3d(0, calc(var(--mac-height)*-17), 0);
}
}
@keyframes dodge {
0% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-15), 0);
transform: translate3d(0, calc(var(--mac-height)*-15), 0);
}
100% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-17), 0);
transform: translate3d(0, calc(var(--mac-height)*-17), 0);
}
}
@-webkit-keyframes block {
0% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-17), 0);
transform: translate3d(0, calc(var(--mac-height)*-17), 0);
}
100% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-18), 0);
transform: translate3d(0, calc(var(--mac-height)*-18), 0);
}
}
@keyframes block {
0% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-17), 0);
transform: translate3d(0, calc(var(--mac-height)*-17), 0);
}
100% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-18), 0);
transform: translate3d(0, calc(var(--mac-height)*-18), 0);
}
}
@-webkit-keyframes tired {
0% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-21), 0);
transform: translate3d(0, calc(var(--mac-height)*-21), 0);
}
100% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-23), 0);
transform: translate3d(0, calc(var(--mac-height)*-23), 0);
}
}
@keyframes tired {
0% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-21), 0);
transform: translate3d(0, calc(var(--mac-height)*-21), 0);
}
100% {
-webkit-transform: translate3d(0, calc(var(--mac-height)*-23), 0);
transform: translate3d(0, calc(var(--mac-height)*-23), 0);
}
}
</style>
</head>
<body translate="no">
<div class="ring"></div>
<div class="mac">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 100 4600" xml:space="preserve" class="mac__sprite">
<g id="frame-1">
<path class="boot" d="M41.8 163.3s-1.9 1.2-2.2 4.1c-.5 4.2.1 10.5.1 10.5s-.3 2.6 5.2 1.1c4.7-1.3 8.3-7.1 8.9-8.2s1.1-5.8-3.6-2.9c.1-1.8.2-4.6.2-4.6h-8.6z" />
<path class="highlight" d="M53.7 170.9c.4-.7.7-2.8-.3-3.6-.4 3.9-3.7 7.8-8.6 8.9-1.3.3-.9-5.8-.9-6.8s-1.9-1.8-2.2.1c-.4 1.9-.1 7.3-.1 7.3s-1 .1-2-.2c.1.8.1 1.3.1 1.3s-.3 2.6 5.2 1.1c4.6-1.3 8.2-7.1 8.8-8.1z" />
<path class="boot" d="M58.6 183c-1.3-1.6.7-6.5 1.9-10.5 1.1-3.9-.5-5.1-.5-5.1-.3.9-.6 1.7-1.1 2.4-3.4 5.3-7.7-.8-7.7-.8s-.4 4.6-.9 6.7c-.3 1.1-.2 3.6-.5 8.1-.3 4.8 2.6 5.6 5.4 5.9 5.2.5 8.2-3.3 3.4-6.7z" />
<path class="highlight" d="M60.3 188.2c-1.9.2-4.8-.2-4.3-4.2.6-6.1-1.5-8.4-2.2-8.4-.6.1-2.4-.6-3.7 2-.1 1.4-.1 3.4-.3 6.2-.3 4.8 2.6 5.6 5.4 5.9 2.3.2 4.1-.4 5.1-1.5z" />
<path class="skin" d="M59.5 155.6H50c-.7-1.6-1.8-3.3-3.4-4.4-4.1-2.8-8.1.6-8.1.6s1.6 4.1 5.4 7c-2.3 3.7-2.7 7-2.7 7s2.8 1 7 0c1-.2 1.9-1.6 2.9-4.3.4 1.3 1 2.5 1.5 2.9-1 1.4-1.5 4.6-1.5 4.6s4.3 6.1 7.7.8c4.4-5.3.7-14.2.7-14.2z" />
<path class="trunk" d="M37.9 127.7c-3.3 2.6-9.9 14.3.9 24.4 0 0 6 1.9 6.5 0 1.9 1.4 4.5 5.6 4.5 5.6s11.3 3.5 13-1.9c1.7-5.4.6-10.8-3.2-25.3-19.3 1.7-21.7-2.8-21.7-2.8z" />
<ellipse class="glove" cx="63.4" cy="99.2" rx="6.9" ry="7.6" />
<path class="glove" d="M27.9 106.5l10 3.9s9.2-5.9 4.7-11.2c2.8-4.5-5-7.9-10-7.3-7 .9-4.7 14.6-4.7 14.6z" />
<path class="skin" d="M75 115.6l-5.4-13H67c-1.5-2.1-2.6-3.6-2.6-3.6l-6-6.1-.7-3.2c3.7-.2 2.4-7.7 2.4-7.7H43.6c-.4 8.7 2.6 7.3 2.6 7.3L44.9 94l-6.7 1.7s-7.6 4.2-13 13.8c-.2.4-.4.9-.6 1.3l-.1.1h.1c-2.1 6 5.1 9.5 8.8 4.7 2.8-3.6 3.6-5 3.6-5v6.9s8.1 7.9 23.5 4.7c2-5 2.2-7 2.1-7.8.5 1.7 2.7 7.4 6.8 8.5 4.4 1.2 5.8-4 5.3-7.4l.3.1z" />
<path class="tank" d="M61.7 96.2l-2.8-2.9c-7.2 9.7-12.5 3.4-13.9.7l-1.7.4c1.1 17-2.7 24.9-6.3 21.6v12.5s2.4 1.7 7.4 2.5l5.5.5c2.8 0 6-.3 9.8-1 1.9-4.7 2.5-8.8 2.8-14.5-7.7 18.8-14.6-13.2-.8-19.8z" />
<path class="hair" d="M46.4 83.2l-.2 6.2s1.5 4.7 5.9 4.7c3.9 0 5.2-2.1 5.7-4.4V83s3.3-2.7 6.5.5c-.6-3.8-3-4.3-5.6-4.3.7-2.1 3.5-1.7 5.3-.4-1.3-3.2-3.6-3.7-5.2-3.7.8-1.8 2.7-1.9 3.8-1.3-.6-1.2-3.7-6.1-10.5-6.1s-8.8 6.8-8.8 9.9.3 4.8.3 4.8 1.6-.3 2.8.8z" />
</g>
<g id="frame-2">
<path class="boot" d="M36.6 365.1s-2 0-2.1 5.2c-.1 4.2.2 10.8.2 10.8s-1 2.9 4.5 1.4c4.7-1.3 5.9-3.8 6.6-4.9s2.1-7.3-2.2-5.7c.1-1.8 0-5.1 0-5.1l-7-1.7z" />
<path class="highlight" d="M46.4 374.3c-2.2 3.4-4.1 6.3-7.7 6.2-.9 0-.5-5.5-.5-6.5s-1.9-1.8-2.3.1c-.4 1.9 0 6.3 0 6.3s-.3.4-1.3.2c0 .5 0 .3.1.7 0 .2.1-.2 0 0-.3.5-.3 2.7 3.8 1.6 4.6-1.3 7.6-3.3 7.9-8.6z" />
<path class="boot" d="M59.9 381.6c-1.1-2.1.8-12.7.8-12.7l.1-1.1c-.3.9 0 .9-.6 1.6-3 3.5-7.8.2-7.8.2s-2.3-.8-1.8 12.7c.2 4.8-.7 5.6 5.6 6.2 11.1 1 11.6-6.8 3.7-6.9z" />
<path class="highlight" d="M64.6 386.5c-1.9.2-10.4 1.5-10.4-1-.1-3.9.2-7.5.2-7.5 0-1.5-2.4-1.9-2.8-.3-.1 1.4 0 5.3 0 5.3v1.4c0 2.6-.9 1.2-.9 1.8.1 2.4 4 2.6 5.5 2.6 3.4.1 6.3.5 8.4-2.3z" />
<path class="skin" d="M46 354.2s4.7 9.6 8.6 10c-1.6.7-2.5 6.7-2.5 6.7s8.5 5.2 9.7-6.8c.6-6.4-1.8-10-1.8-10l-14 .1z" />
<path class="skin" d="M33.8 353.4s1.2 4.8 5 7.8c-2.8 3.6-3 6.6-3 6.6s2.5.5 6.8-.4c0 0 2.1-1.5 3.1-4.3.4-1.3 2.4-7.6-1.7-10.3-.5-.3-.2-.9-.8-1.1-3.9-1.3-9.4 1.7-9.4 1.7z" />
<path class="trunk" d="M34.8 330.3c-3.3 2.6-9.2 18.4-2 23.1 0 0 11.9.8 10.3-1.5 1.9 1.4 1.7 2.2 1.7 2.2s16 3.6 17.6-1.8c1.7-5.4-1.3-5.7-5-20.2-3.1-3.3-22.6-1.8-22.6-1.8z" />
<ellipse class="glove" cx="59.7" cy="298.8" rx="6.9" ry="7.6" />
<path class="glove" d="M28.2 300l10 3.9s9.2-5.9 4.7-11.2c2.8-4.5-5-7.9-10-7.3-7 1-4.7 14.6-4.7 14.6z" />
<path class="skin" d="M70.6 312.3l-.1-.1-4.8-9.5-2.9-.7c-1.3-1.8-2.2-3.1-2.2-3.1l-6-6.1-.5-4.4c3.7-.2 2.4-7.7 2.4-7.7H40c-.4 8.7 2.6 7.3 2.6 7.3l-1.3 4.7-6.7 1.7s-1.5.8-4.9 6.2l-1.5-.6-1.4 5.4c-3.7 6.9 1.4 15.2 6.5 9.3v.2s8.1 10.3 23.7 7.2c2.8-7.1 2-10.9 1.9-11.4.2.6 2.4 9.4 7.2 10 4.7.6 4.9-7.9 4.5-8.4z" />
<path class="tank" d="M57.6 295.9l-3.1-3.1c-7.2 9.7-11.8 2.6-13.3-.1l-2.6.7c4.4 13.7-2.6 24.4-5.3 21.4l1.5 15.7s1.9-.3 7.8 0h7c2.8 0 4.3 0 7.7 1.9.4-9.4 1.1-11.9 1.4-17.6-7.7 18.5-13.7-13.6-1.1-18.9z" />
<path class="hair" d="M42.7 281.8l-.2 6.2s1.5 4.7 5.9 4.7c3.9 0 5.2-2.1 5.7-4.4v-6.7s3.3-2.7 6.5.5c-.6-3.8-3-4.3-5.6-4.3.7-2.1 3.5-1.7 5.3-.4-1.3-3.2-3.6-3.7-5.2-3.7.8-1.8 2.7-1.9 3.8-1.3-.6-1.2-3.7-6.1-10.5-6.1s-8.8 6.8-8.8 9.9.3 4.8.3 4.8 1.6-.3 2.8.8z" />
</g>
<g id="frame-3">
<path class="boot" d="M41.8 563.3s-1.9 1.2-2.2 4.1c-.5 4.2.1 10.5.1 10.5s-.3 2.6 5.2 1.1c4.7-1.3 8.3-7.1 8.9-8.2.6-1.1 1.1-5.8-3.6-2.9.1-1.8.2-4.6.2-4.6h-8.6z" />
<path class="highlight" d="M53.7 570.9c.4-.7.7-2.8-.3-3.6-.4 3.9-3.7 7.8-8.6 8.9-1.3.3-.9-5.8-.9-6.8s-1.9-1.8-2.2.1c-.4 1.9-.1 7.3-.1 7.3s-1 .1-2-.2c0 .9.1 1.3.1 1.3s-.3 2.6 5.2 1.1c4.8-1.2 8.2-7.1 8.8-8.1z" />
<path class="boot" d="M58.6 583c-1.3-1.6.7-6.5 1.9-10.5 1.1-3.9-.5-5.1-.5-5.1-.3.9-.6 1.7-1.1 2.4-3.4 5.3-7.7-.8-7.7-.8s-.4 4.6-.9 6.7c-.3 1.1-.2 3.6-.5 8.1-.3 4.8 2.6 5.6 5.4 5.9 5.2.5 8.2-3.3 3.4-6.7z" />
<path class="highlight" d="M60.3 588.2c-1.9.2-4.8-.2-4.3-4.2.6-6.1-1.5-8.4-2.2-8.4-.6.1-2.4-.6-3.7 2-.1 1.4-.1 3.4-.3 6.2-.3 4.8 2.6 5.6 5.4 5.9 2.3.2 4.1-.4 5.1-1.5z" />
<path class="skin" d="M59.5 555.6H50c-.7-1.6-1.8-3.3-3.4-4.4-4.1-2.8-8.1.6-8.1.6s1.6 4.1 5.4 7c-2.3 3.7-2.7 7-2.7 7s2.8 1 7 0c1-.2 1.9-1.6 2.9-4.3.4 1.3 1 2.5 1.5 2.9-1 1.4-1.5 4.6-1.5 4.6s4.3 6.1 7.7.8c4.8-6 .7-14.2.7-14.2z" />
<path class="trunk" d="M37.9 527.7c-3.3 2.6-9.9 14.3.9 24.4 0 0 6 1.9 6.5 0 1.9 1.4 4.5 5.6 4.5 5.6s11.3 3.5 13-1.9c1.7-5.4.6-10.8-3.2-25.3-19.3 1.7-21.7-2.8-21.7-2.8z" />
<ellipse class="glove" cx="61.4" cy="499.2" rx="6.9" ry="7.6" />
<path class="glove" d="M31.9 500.5l10 3.9s8.6-4 4.1-9.3c2.8-4.5-3.4-9.2-8.4-8.6-7.1.9-5.7 14-5.7 14z" />
<path class="skin" d="M75 515.6l-.5-.8v-.2c-.4-1.2-1.8-3.6-3.5-6.1l-3.3-5.9H67c-1.5-2.1-2.6-3.6-2.6-3.6l-6-6.1-.7-3.2c3.7-.2 2.4-7.7 2.4-7.7H43.6c-.4 8.7 2.6 7.3 2.6 7.3l-1.3 4.7-6.8 2.5s-2.4 1.6-5 4.4l-1.2-.5-.7 2.7c-.4.5-.8 1-1.1 1.6-5.8 8.7 1.7 17.3 6.9 8.4v3.4s8.1 8.8 23.5 5.6c2-5 2.2-7 2.1-7.8.5 1.7 2.7 7.4 6.8 8.5 4.4 1.2 5.8-4 5.3-7.4l.3.2z" />
<path class="tank" d="M61.7 496.2l-2.8-2.9c-7.2 9.7-12.5 3.4-13.9.7l-1.7.4c1.1 17-2.7 24.9-6.3 21.6v12.5s2.4 1.7 7.4 2.5l5.5.5c2.8 0 6-.3 9.8-1 1.9-4.7 2.5-8.8 2.8-14.5-7.7 18.8-14.6-13.2-.8-19.8z" />
<path class="hair" d="M46.4 483.2l-.2 6.2s1.5 4.7 5.9 4.7c3.9 0 5.2-2.1 5.7-4.4V483s3.3-2.7 6.5.5c-.6-3.8-3-4.3-5.6-4.3.7-2.1 3.5-1.7 5.3-.4-1.3-3.2-3.6-3.7-5.2-3.7.8-1.8 2.7-1.9 3.8-1.3-.6-1.2-3.7-6.1-10.5-6.1s-8.8 6.8-8.8 9.9c0 3.1.3 4.8.3 4.8s1.6-.3 2.8.8z" />
</g>
<g id="frame-4">
<path class="boot" d="M41 763.4s-1.9 1.2-2.2 4.1c-.5 4.2.1 10.5.1 10.5s-.3 2.6 5.2 1.1c4.7-1.3 8.3-7.1 8.9-8.2s1.1-5.8-3.6-2.9c.1-1.8.2-4.6.2-4.6H41z" />
<path class="highlight" d="M52.9 771c.4-.7.7-2.8-.3-3.6-.4 3.9-3.7 7.8-8.6 8.9-1.3.3-.9-5.8-.9-6.8s-1.9-1.8-2.2.1c-.4 1.9-.1 7.3-.1 7.3s-1 .1-2-.2c0 .9.1 1.3.1 1.3s-.3 2.6 5.2 1.1c4.8-1.3 8.2-7.1 8.8-8.1z" />
<path class="boot" d="M57.8 783.1c-1.3-1.6.7-6.5 1.9-10.5 1.1-3.9-.5-5.1-.5-5.1-.3.9-.6 1.7-1.1 2.4-3.4 5.3-7.7-.8-7.7-.8s-.4 4.6-.9 6.7c-.3 1.1-.2 3.6-.5 8.1-.3 4.8 2.6 5.6 5.4 5.9 5.2.5 8.2-3.3 3.4-6.7z" />
<path class="highlight" d="M59.5 788.3c-1.9.2-4.8-.2-4.3-4.2.6-6.1-1.5-8.4-2.2-8.4-.6.1-2.4-.6-3.7 2-.1 1.4-.1 3.4-.3 6.2-.3 4.8 2.6 5.6 5.4 5.9 2.3.2 4.1-.4 5.1-1.5z" />
<path class="skin" d="M58.7 755.7h-9.5c-.7-1.6-1.8-3.3-3.4-4.4-4.1-2.8-8.1.6-8.1.6s1.6 4.1 5.4 7c-2.3 3.7-2.7 7-2.7 7s2.8 1 7 0c1-.2 1.9-1.6 2.9-4.3.4 1.3 1 2.5 1.5 2.9-1 1.4-1.5 4.6-1.5 4.6s4.3 6.1 7.7.8c4.8-6.1.7-14.2.7-14.2z" />
<path class="trunk" d="M37.1 727.8c-3.3 2.6-9.9 14.3.9 24.4 0 0 6 1.9 6.5 0 1.9 1.4 4.5 5.6 4.5 5.6s11.3 3.5 13-1.9c1.7-5.4.6-10.8-3.2-25.3-19.3 1.7-21.7-2.8-21.7-2.8z" />
<ellipse class="glove" cx="60.6" cy="699.3" rx="6.9" ry="7.6" />
<path class="glove" d="M32.9 679.6l3.2 5.1s8.2 2.6 7.8-3c4-1.6 2.2-7.6-1.4-9.7-4.9-2.8-9.6 7.6-9.6 7.6z" />
<path class="skin" d="M74.2 715.7l-.5-.8v-.2c-.4-1.2-1.8-3.6-3.5-6.1l-3.3-5.9h-.7c-1.5-2.1-2.6-3.6-2.6-3.6l-6-6.1-.7-3.2c3.7-.2 2.4-7.7 2.4-7.7H42.8c-.4 8.7 2.6 7.3 2.6 7.3l-1.3 4.7-1.6.4s.2-4.3-11.5-7.6l5.1-2.2-3.2-5.1-9.9 5.6c-4.9 3.2 7.2 12.8 13.9 16.9l.6 7.8-.2 3.5s7.1 12.1 22.5 8.9c2-5 2.2-7 2.1-7.8.5 1.7 2.7 7.4 6.8 8.5 4.4 1.2 5.8-4 5.3-7.4l.2.1z" />
<path class="tank" d="M60.9 696.3l-2.8-2.9c-7.2 9.7-12.5 3.4-13.9.7l-1.7.4c.1 10.6-1.2 15.5-5 15.4l-.4 17.9s1.5 2.5 6.5 3.3l5.5.5c2.8 0 6-.3 9.8-1 1.9-4.7 2.5-8.8 2.8-14.5-7.7 18.8-14.6-13.2-.8-19.8z" />
<path class="hair" d="M45.6 683.3l-.2 6.2s1.5 4.7 5.9 4.7c3.9 0 5.2-2.1 5.7-4.4v-6.7s3.3-2.7 6.5.5c-.6-3.8-3-4.3-5.6-4.3.7-2.1 3.5-1.7 5.3-.4-1.3-3.2-3.6-3.7-5.2-3.7.8-1.8 2.7-1.9 3.8-1.3-.6-1.2-3.7-6.1-10.5-6.1s-8.8 6.8-8.8 9.9.3 4.8.3 4.8 1.6-.3 2.8.8z" />
</g>
<g id="frame-5">
<path class="boot" d="M41.2 962.6s-1.9 1.2-2.2 4.1c-.5 4.2.1 10.5.1 10.5s-.3 2.6 5.2 1.1c4.7-1.3 8.3-7.1 8.9-8.2s1.1-5.8-3.6-2.9c.1-1.8.2-4.6.2-4.6h-8.6z" />
<path class="highlight" d="M53.1 970.2c.4-.7.7-2.8-.3-3.6-.4 3.9-3.7 7.8-8.6 8.9-1.3.3-.9-5.8-.9-6.8s-1.9-1.8-2.2.1c-.4 1.9-.1 7.3-.1 7.3s-1 .1-2-.2c0 .9.1 1.3.1 1.3s-.3 2.6 5.2 1.1c4.8-1.3 8.2-7.1 8.8-8.1z" />
<path class="boot" d="M58 982.3c-1.3-1.6.7-6.5 1.9-10.5 1.1-3.9-.5-5.1-.5-5.1-.3.9-.6 1.7-1.1 2.4-3.4 5.3-7.7-.8-7.7-.8s-.4 4.6-.9 6.7c-.3 1.1-.2 3.6-.5 8.1-.3 4.8 2.6 5.6 5.4 5.9 5.2.5 8.2-3.3 3.4-6.7z" />
<path class="highlight" d="M59.7 987.5c-1.9.2-4.8-.2-4.3-4.2.6-6.1-1.5-8.4-2.2-8.4-.6.1-2.4-.6-3.7 2-.1 1.4-.1 3.4-.3 6.2-.3 4.8 2.6 5.6 5.4 5.9 2.3.2 4.1-.4 5.1-1.5z" />
<path class="skin" d="M58.9 954.9h-9.5c-.7-1.6-1.8-3.3-3.4-4.4-4.1-2.8-8.1.6-8.1.6s1.6 4.1 5.4 7c-2.3 3.7-2.7 7-2.7 7s2.8 1 7 0c1-.2 1.9-1.6 2.9-4.3.4 1.3 1 2.5 1.5 2.9-1 1.4-1.5 4.6-1.5 4.6s4.3 6.1 7.7.8c4.8-6 .7-14.2.7-14.2z" />
<path class="trunk" d="M37.3 927c-3.3 2.6-9.9 14.3.9 24.4 0 0 6 1.9 6.5 0 1.9 1.4 4.5 5.6 4.5 5.6s11.3 3.5 13-1.9c1.7-5.4.6-10.8-3.2-25.3-19.3 1.7-21.7-2.8-21.7-2.8z" />
<path class="glove" d="M65.6 889c3.8 0 7.4 1.8 7.4 6 0 2.1-.1 5.5-1.4 6.8-.9 1-3.3.7-4.5 1-.5.1.5 0 0 0-3.8 0-7.2-2.2-7.2-6.4 0-1 .6-2 1.5-2-.4-1.5 1.3-5.4 4.2-5.4z" />
<path class="glove" d="M41.3 865.7l7 2.2s9.5-4 4.8-8.9c2.4-4.6-4-8.7-8.8-7.8-6.9 1.4-3 14.5-3 14.5z" />
<path class="skin" d="M71.7 901.9l-4.5 1 .5 2.7c-3.1-4.6-7.2-9.7-8.1-10.2-1.5-.7-4.5-1-4.5-1l-.9-3.5c3.1-.7 1.5-15.8 1.5-15.8h-4.4c-.4 8.7-5.5 13.4-5.5 13.4l-1 3.1-1.9-.3s.5-3.7-4.1-6.1l9.7-17.4-7-2.2-10.2 17.7c-2 4.9-1.7 14.3 3.2 21l1.6 4.4.3 4.4s7.4 10.7 22.8 7.5c.7-5.8.4-11.6.4-11.6s4.7 7.8 9.5 9.1c2.6.7 3.5-.2 3.6-1.7.9-3.7-1-14.5-1-14.5z" />
<path class="tank" d="M55 894.4l-.5-2.1c-7.7-.1-9.1 10.4-13.1 1.2l-.3-.6-1.3.3c.1 10.6.1 20.2-3.7 20.2l.3 14.7s2.5 1.6 7.5 2.4l5.5.5c2.8 0 6-.3 9.8-1 .3-7.4 0-11.2.2-16.6-10.6 19.1-16.7-22.5-4.4-19z" />
<path class="hair" d="M39.3 886.6c.9 1.2.8 3.6.8 3.6l3 1.6c3.7 1.1 7.3-3.7 7.5-6.4.5-5.9 2.3-13 7.5-5.1.2-1.2-.3-4.1-1.3-5.2 1-.3 1-.4 2.2.4-.3-2.3-2.2-3.5-3.3-3.4 1.1-.9 1.6-1 2.9-.3-.6-1.2-3-4.7-8.7-4.9-11.7-.5-11.5 17.7-11.5 18.5v.1c.2.1.3.4.9 1.1z" />
</g>
<g id="frame-6">
<path class="boot" d="M61.5 1105.8h-4.4l-.1-5.9 4.5.1z" />
<path class="skin" d="M62.1 1144.3l-7.3-1c-.7-1.5-1.8-3-3.2-4-4.1-2.8-10.1 1.2-10.1 1.2s3.3 3.8 3.1 12.1c2.8.5 6.1.3 8.5-.6-1 1.4-1.6 9.2-1.6 9.2s2.7 6.6 6.1 1.3c4.6-6 4.5-18.2 4.5-18.2z" />
<path class="trunk" d="M42.8 1116.2c-3.4 3.8-8.5 15.4-1.4 24.7l6.3-.1s.1-.1.1 0c3.7 2.9 1.6 1.1 1.6 1.1s2.8 3.4 15.1 2.2c1.1-6.6-.2-13.3-2.5-21.6-2.4 1-16.6-9.1-19.2-6.3z" />
<path class="glove" d="M66.3 1088.9c3.8 0 7.4 1.8 7.4 6 0 2.1.3 7.5-1 8.9-.9 1-5.5 3.1-6.8 3.4-.5.1.5 0 0 0-3.8 0-5.3-6.7-5.3-10.9 0-1 .6-2 1.5-2-.4-1.5 1.3-5.4 4.2-5.4z" />
<path class="skin" d="M65.9 1107.2s-1.7-3.1-4.1-3.9c-2.1.5-3.9.3-3.9.3 2.7-.8 8.4-14.8.5-20-1-1.4-.9-2.5-.9-2.5v-4.1c1.9-.1 1.6-9.5 1.6-9.5l-2.4-3.2c-.4 8.7-5.5 13.4-5.5 13.4s-.5-2.8-3.4-6.6l8.1-32.4-6.9-.7-8.4 30c-2.5 3.3-3.3 14.5-1 22.1 0 0 2.3 28.9 18.5 23.6 1.7.3 4.1-3.7 4.3-4.3 1.9-1.1 3.5-2.2 3.5-2.2z" />
<path class="glove" d="M48.8 1038.8c1-.8 7.1 0 7.1 0s9.6-5.7 6.7-11.2c2.8-5.3-4.6-10.1-10.3-9.1-7.9 1.7-4.2 20.9-3.5 20.3z" />
<path class="tank" d="M58.4 1083.7l-.9-2.5c-9.7-.1-10.6 9.2-13.2 2.4-1-2.7 1.2-4.9 1.2-4.9l-.2-1.5c-6.3 4.3-2.7 12.3-5.9 13-.7 11.6 3.6 14.5 3.3 26 5.3.5 15.3 7 19.1 6.3-.1-8.4.1-12.4.1-12.4-4.6 3.7-17.1 10.4-11.2-10-3.8-2.1-5.9-15.3 7.7-16.4z" />
<path class="hair" d="M44.8 1075.9c.8 1.2.7 3.6.8 3.6l3 1.6c3.7 1.1 7.4-3.7 7.5-6.4.2-7.6 2.1-7 4.7-7 .2-1.2.1-3.7-.8-4.7 1-.3 2-.8 3.2 0-.3-2.3-2.6-3.9-3.7-3.8.4-1.3 2.3-2.8 3.6-2.1-.6-1.2-1.9-2.7-8.7-2.9-13.8-.4-11.5 19.4-11.4 20.2l.9.5c.2-.1.3.2.9 1z" />
<path class="boot" d="M39.3 1142.2s3.2.6 4.6 2.1c2.2 2.4 3.8 6 3.9 8.5-5.2 0-5.3 4.9-5.6 6.1-.3 1.3-2.9-16.7-2.9-16.7z" />
<path class="highlight" d="M43.1 1153c0 6-2.8 10.8-5 10.8s-4.1-5-4.1-11c0-9.4 3.1-10.7 5.2-10.7 2.2.1 3.9 5 3.9 10.9z" />
<path class="boot" d="M57.9 1167.4c-.4 4.8-2.4 10-4.7 10-2.3 0-3.2-5.1-3.2-10s1.9-9.3 3.7-7.9c2.5 1.7 3.6 3 4.2 2.3.6.8.2 2.8 0 5.6z" />
<path class="highlight" d="M57 1169.4c-.7 5.7-1.7 9.6-4 9.6s-4.6-4.3-4.6-10 2.1-10 4.4-10 5.4 1.5 4.2 10.4z" />
</g>
<g id="frame-7">
<path class="boot" d="M40.4 1363.1s-2 0-2.1 5.2c-.1 4.2.2 10.8.2 10.8s-1 2.9 4.5 1.4c4.7-1.3 5.9-3.8 6.6-4.9s2.1-7.3-2.2-5.7c.1-1.8 0-5.1 0-5.1l-7-1.7z" />
<path class="highlight" d="M50.2 1372.3c-2.2 3.4-4.1 6.3-7.7 6.2-.9 0-.5-5.5-.5-6.5s-1.9-1.8-2.3.1c-.4 1.9 0 6.3 0 6.3s-.3.4-1.3.2c0 .5 0 .3.1.7 0 .2.1-.2 0 0-.3.5-.3 2.7 3.8 1.6 4.6-1.3 7.6-3.3 7.9-8.6z&q.........完整代码请登录后点击上方下载按钮下载查看
热门代码搜索
其他语言代码库
Html代码库
Python代码库
Java代码库
Php代码库
Phpcli代码库
Golang代码库
C#代码库
Nodejs代码库
C代码库
C++代码库
Sql代码库
R代码库
Rust代码库
Ruby代码库
Dart代码库
Vb代码库
D代码库
F#代码库
Typescript代码库
Coffeescript代码库
Julia代码库
Kotlin代码库
Perl代码库
Groovy代码库
Lua代码库
Vala代码库
Ocaml代码库
Assembly代码库
Objectc代码库
Scala代码库
Erlang代码库
Pascal代码库
Swift代码库
Fortran代码库
Bash代码库
Clojure代码库
Ada代码库
Elixir代码库
Cobol代码库
Haskell代码库
Nim代码库
Racket代码库
Lisp代码库
网友评论0