- lovesusu2026-08-136034
大家都测鹈鹕, 那我就测点不一样的
Claude Code:


<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>狮子开飞机 · Lion Pilot</title> <style> * { margin: 0; padding: 0; box-sizing: border-box; } html, body { height: 100%; } body { display: flex; align-items: center; justify-content: center; background: radial-gradient(circle at 50% 30%, #2f6fae, #16406e 70%); font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans SC", "Segoe UI", sans-serif; overflow: hidden; } .stage { position: relative; width: min(1200px, 96vw); border-radius: 24px; overflow: hidden; box-shadow: 0 24px 60px rgba(0, 0, 0, .35); } svg { display: block; width: 100%; height: auto; } .title { position: absolute; top: 5%; left: 0; right: 0; text-align: center; pointer-events: none; z-index: 2; } .title h1 { font-size: clamp(30px, 6vw, 58px); color: #fff; letter-spacing: .08em; text-shadow: 0 3px 0 #e0762b, 0 7px 20px rgba(0,0,0,.3); animation: floaty 4s ease-in-out infinite; } .title p { margin-top: 8px; color: #fff; opacity: .92; letter-spacing: .38em; font-size: clamp(10px, 1.5vw, 14px); text-shadow: 0 2px 8px rgba(0,0,0,.35); } @keyframes floaty { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } } </style> </head> <body> <div class="stage"> <div class="title"> <h1>🦁 狮子开飞机</h1> <p>LION PILOT · SVG 2D ANIMATION</p> </div> <svg viewBox="0 0 1200 800" preserveAspectRatio="xMidYMid meet" xmlns="http://www.w3.org/2000/svg"> <defs> <linearGradient id="sky" x1="0" y1="0" x2="0" y2="1"> <stop offset="0" stop-color="#4db3f0"/> <stop offset="0.65" stop-color="#a5e0fb"/> <stop offset="1" stop-color="#e8f9ff"/> </linearGradient> <radialGradient id="sunGrad"> <stop offset="0" stop-color="#fff3b0"/> <stop offset="1" stop-color="#ffcf3f"/> </radialGradient> <!-- 云朵组件 --> <g id="cloud" fill="#ffffff"> <ellipse cx="0" cy="6" rx="72" ry="24"/> <circle cx="-38" cy="-8" r="26"/> <circle cx="-2" cy="-18" r="32"/> <circle cx="34" cy="-10" r="28"/> <circle cx="56" cy="2" r="18"/> </g> <!-- 太阳光芒单条 --> <g id="ray"> <path d="M 0 -96 L 8 -64 L -8 -64 Z" fill="#ffd75e" opacity="0.9"/> </g> </defs> <!-- ============ 天空 ============ --> <rect width="1200" height="800" fill="url(#sky)"/> <!-- ============ 太阳(带表情 + 旋转光芒) ============ --> <g transform="translate(170,140)"> <circle r="80" fill="#ffd75e" opacity="0.25"/> <g> <animateTransform attributeName="transform" type="rotate" from="0" to="360" dur="45s" repeatCount="indefinite"/> <use href="#ray"/> <use href="#ray" transform="rotate(36)"/> <use href="#ray" transform="rotate(72)"/> <use href="#ray" transform="rotate(108)"/> <use href="#ray" transform="rotate(144)"/> <use href="#ray" transform="rotate(180)"/> <use href="#ray" transform="rotate(216)"/> <use href="#ray" transform="rotate(252)"/> <use href="#ray" transform="rotate(288)"/> <use href="#ray" transform="rotate(324)"/> </g> <circle r="50" fill="url(#sunGrad)"/> <circle cx="-14" cy="-8" r="4.5" fill="#7a4a1e"/> <circle cx="14" cy="-8" r="4.5" fill="#7a4a1e"/> <path d="M -12 12 Q 0 22 12 12" stroke="#7a4a1e" stroke-width="3" fill="none" stroke-linecap="round"/> </g> <!-- ============ 远层云(慢速) ============ --> <g transform="translate(1450,110) scale(0.5)"> <g><animateTransform attributeName="transform" type="translate" from="0 0" to="-1900 0" dur="135s" begin="-16s" repeatCount="indefinite"/><use href="#cloud" opacity="0.8"/></g> </g> <g transform="translate(1500,205) scale(0.42)"> <g><animateTransform attributeName="transform" type="translate" from="0 0" to="-1950 0" dur="120s" begin="-66s" repeatCount="indefinite"/><use href="#cloud" opacity="0.75"/></g> </g> <g transform="translate(1420,305) scale(0.45)"> <g><animateTransform attributeName="transform" type="translate" from="0 0" to="-1900 0" dur="140s" begin="-112s" repeatCount="indefinite"/><use href="#cloud" opacity="0.7"/></g> </g> <!-- ============ 山丘与草地 ============ --> <path d="M 0 800 L 0 660 Q 90 600 180 650 Q 260 590 360 640 Q 470 580 560 640 Q 680 595 780 645 Q 900 600 1000 650 Q 1100 610 1200 655 L 1200 800 Z" fill="#a9d99c"/> <path d="M 0 800 L 0 700 Q 140 640 260 700 Q 380 640 500 705 Q 640 645 760 705 Q 900 655 1040 700 Q 1120 670 1200 700 L 1200 800 Z" fill="#7fc26b"/> <rect y="756" width="1200" height="44" fill="#5aa844"/> <ellipse cx="80" cy="772" rx="46" ry="7" fill="#4c9440" opacity="0.7"/> <ellipse cx="420" cy="784" rx="60" ry="8" fill="#4c9440" opacity="0.7"/> <ellipse cx="760" cy="770" rx="52" ry="7" fill="#4c9440" opacity="0.7"/> <ellipse cx="1050" cy="786" rx="44" ry="6" fill="#4c9440" opacity="0.7"/> <!-- 树木 --> <g transform="translate(90,742)"> <rect x="-3.5" y="-16" width="7" height="16" rx="2" fill="#7a4a1e"/> <circle cy="-22" r="14" fill="#3f8f3a"/> <circle cx="-8" cy="-15" r="10" fill="#4c9c44"/> <circle cx="8" cy="-15" r="10" fill="#4c9c44"/> </g> <g transform="translate(230,736) scale(0.85)"> <rect x="-3.5" y="-16" width="7" height="16" rx="2" fill="#7a4a1e"/> <circle cy="-22" r="14" fill="#3f8f3a"/> <circle cx="-8" cy="-15" r="10" fill="#4c9c44"/> <circle cx="8" cy="-15" r="10" fill="#4c9c44"/> </g> <g transform="translate(1070,740)"> <rect x="-3.5" y="-16" width="7" height="16" rx="2" fill="#7a4a1e"/> <circle cy="-22" r="14" fill="#3f8f3a"/> <circle cx="-8" cy="-15" r="10" fill="#4c9c44"/> <circle cx="8" cy="-15" r="10" fill="#4c9c44"/> </g> <g transform="translate(1150,742) scale(0.7)"> <rect x="-3.5" y="-16" width="7" height="16" rx="2" fill="#7a4a1e"/> <circle cy="-22" r="14" fill="#3f8f3a"/> <circle cx="-8" cy="-15" r="10" fill="#4c9c44"/> <circle cx="8" cy="-15" r="10" fill="#4c9c44"/> </g> <!-- 飞机投影 --> <ellipse cx="600" cy="705" rx="130" ry="14" fill="#3f7a2f" opacity="0.3"/> <!-- ============ 中层云(中速) ============ --> <g transform="translate(1520,140) scale(0.75)"> <g><animateTransform attributeName="transform" type="translate" from="0 0" to="-2000 0" dur="85s" begin="-17s" repeatCount="indefinite"/><use href="#cloud" opacity="0.92"/></g> </g> <g transform="translate(1480,255) scale(0.65)"> <g><animateTransform attributeName="transform" type="translate" from="0 0" to="-1950 0" dur="95s" begin="-46s" repeatCount="indefinite"/><use href="#cloud" opacity="0.9"/></g> </g> <g transform="translate(1560,385) scale(0.8)"> <g><animateTransform attributeName="transform" type="translate" from="0 0" to="-2000 0" dur="78s" begin="-55s" repeatCount="indefinite"/><use href="#cloud" opacity="0.95"/></g> </g> <g transform="translate(1440,475) scale(0.6)"> <g><animateTransform attributeName="transform" type="translate" from="0 0" to="-1900 0" dur="105s" begin="-5s" repeatCount="indefinite"/><use href="#cloud" opacity="0.85"/></g> </g> <!-- ============ 风线 ============ --> <g><animateTransform attributeName="transform" type="translate" from="0 0" to="-1800 0" dur="2.8s" begin="-1.2s" repeatCount="indefinite"/> <line x1="1280" y1="150" x2="1580" y2="150" stroke="#ffffff" stroke-width="4" stroke-linecap="round" opacity="0.25"/></g> <g><animateTransform attributeName="transform" type="translate" from="0 0" to="-1800 0" dur="3.3s" begin="-2.1s" repeatCount="indefinite"/> <line x1="1260" y1="285" x2="1520" y2="285" stroke="#ffffff" stroke-width="3.5" stroke-linecap="round" opacity="0.2"/></g> <g><animateTransform attributeName="transform" type="translate" from="0 0" to="-1900 0" dur="3.0s" begin="-0.4s" repeatCount="indefinite"/> <line x1="1300" y1="560" x2="1600" y2="560" stroke="#ffffff" stroke-width="4" stroke-linecap="round" opacity="0.22"/></g> <g><animateTransform attributeName="transform" type="translate" from="0 0" to="-1850 0" dur="3.6s" begin="-1.8s" repeatCount="indefinite"/> <line x1="1250" y1="610" x2="1550" y2="610" stroke="#ffffff" stroke-width="3" stroke-linecap="round" opacity="0.18"/></g> <!-- ============ 飞机(狮子机长) ============ --> <g transform="translate(600,350)"> <!-- 整体浮动 + 轻微俯仰 --> <g> <animateTransform attributeName="transform" type="translate" values="0 0; 0 -16; 0 0" keyTimes="0;0.5;1" calcMode="spline" keySplines="0.45 0 0.55 1;0.45 0 0.55 1" dur="4.8s" repeatCount="indefinite"/> <g> <animateTransform attributeName="transform" type="rotate" values="-1.8 0 0; 2.2 0 0; -1.8 0 0" keyTimes="0;0.5;1" calcMode="spline" keySplines="0.45 0 0.55 1;0.45 0 0.55 1" dur="4.8s" repeatCount="indefinite"/> <!-- 尾气烟圈 --> <circle cx="118" cy="6" r="5" fill="#ffffff"> <animate attributeName="cx" values="118; -60" dur="2.4s" begin="0s" repeatCount="indefinite"/> <animate attributeName="cy" values="6; -14" dur="2.4s" begin="0s" repeatCount="indefinite"/> <animate attributeName="r" values="5; 20" dur="2.4s" begin="0s" repeatCount="indefinite"/> <animate attributeName="opacity" values="0; 0.55; 0.35; 0" keyTimes="0;0.2;0.6;1" dur="2.4s" begin="0s" repeatCount="indefinite"/> </circle> <circle cx="118" cy="6" r="5" fill="#ffffff"> <animate attributeName="cx" values="118; -60" dur="2.4s" begin="0.8s" repeatCount="indefinite"/> <animate attributeName="cy" values="6; -14" dur="2.4s" begin="0.8s" repeatCount="indefinite"/> <animate attributeName="r" values="5; 20" dur="2.4s" begin="0.8s" repeatCount="indefinite"/> <animate attributeName="opacity" values="0; 0.55; 0.35; 0" keyTimes="0;0.2;0.6;1" dur="2.4s" begin="0.8s" repeatCount="indefinite"/> </circle> <circle cx="118" cy="6" r="5" fill="#ffffff"> <animate attributeName="cx" values="118; -60" dur="2.4s" begin="1.6s" repeatCount="indefinite"/> <animate attributeName="cy" values="6; -14" dur="2.4s" begin="1.6s" repeatCount="indefinite"/> <animate attributeName="r" values="5; 20" dur="2.4s" begin="1.6s" repeatCount="indefinite"/> <animate attributeName="opacity" values="0; 0.55; 0.35; 0" keyTimes="0;0.2;0.6;1" dur="2.4s" begin="1.6s" repeatCount="indefinite"/> </circle> <!-- 尾翼:水平安定面 --> <rect x="-248" y="-24" width="70" height="13" rx="6" fill="#e8482f" stroke="#c0351c" stroke-width="2"/> <!-- 尾翼:垂直安定面 --> <path d="M -212 -26 Q -230 -54 -194 -62 Q -200 -40 -204 -24 Z" fill="#c93a24"/> <!-- 尾轮 --> <line x1="-196" y1="18" x2="-196" y2="25" stroke="#7a4a1e" stroke-width="4"/> <circle cx="-196" cy="32" r="7.5" fill="#3b3b3b" stroke="#222222" stroke-width="2"/> <!-- 尾锥 + 机身 --> <path d="M -156 -24 C -190 -28 -216 -22 -228 -13 L -228 13 C -216 22 -190 28 -156 24 Z" fill="#e8482f" stroke="#c0351c" stroke-width="2.5"/> <rect x="-160" y="-28" width="230" height="56" rx="26" fill="#e8482f" stroke="#c0351c" stroke-width="2.5"/> <rect x="-152" y="10" width="214" height="12" rx="6" fill="#f6d365" opacity="0.95"/> <!-- 机身徽章 --> <circle cx="18" cy="-2" r="11" fill="#f6d365"/> <circle cx="18" cy="-2" r="5.5" fill="#e8482f"/> <!-- 发动机整流罩 --> <circle cx="92" cy="0" r="40" fill="#c93a24" stroke="#a83220" stroke-width="3"/> <ellipse cx="120" cy="0" rx="14" ry="34" fill="#a83220" opacity="0.5"/> <path d="M 66 -24 Q 92 -38 118 -20" stroke="#ffffff" stroke-width="6" fill="none" opacity="0.45" stroke-linecap="round"/> <rect x="58" y="12" width="22" height="7" rx="3.5" fill="#6b5234"/> <!-- 座舱口 --> <ellipse cx="-40" cy="-24" rx="33" ry="11" fill="#53250e"/> <!-- 下翼 --> <rect x="-140" y="62" width="240" height="28" rx="11" fill="#f6d365" stroke="#c98a1f" stroke-width="3"/> <rect x="-38" y="62" width="24" height="28" rx="6" fill="#e8482f"/> <!-- 起落架 + 主轮 --> <line x1="8" y1="26" x2="40" y2="56" stroke="#7a4a1e" stroke-width="4"/> <line x1="40" y1="26" x2="40" y2="56" stroke="#7a4a1e" stroke-width="5"/> <circle cx="40" cy="72" r="19" fill="#3b3b3b" stroke="#222222" stroke-width="2"/> <circle cx="40" cy="72" r="7" fill="#f6d365"/> <!-- ============ 狮子机长 ============ --> <g> <!-- 鬃毛 --> <circle cx="-30" cy="-66" r="48" fill="#c07f26"/> <circle cx="6" cy="-66" r="17" fill="#c07f26"/> <circle cx="-5" cy="-91" r="17" fill="#c07f26"/> <circle cx="-30" cy="-102" r="17" fill="#c07f26"/> <circle cx="-55" cy="-91" r="17" fill="#c07f26"/> <circle cx="-66" cy="-66" r="17" fill="#c07f26"/> <circle cx="-55" cy="-41" r="17" fill="#c07f26"/> <circle cx="-30" cy="-30" r="17" fill="#c07f26"/> <circle cx="-5" cy="-41" r="17" fill="#c07f26"/> <!-- 耳朵 --> <circle cx="-55" cy="-94" r="11" fill="#f2b558"/> <circle cx="-5" cy="-94" r="11" fill="#f2b558"/> <circle cx="-55" cy="-94" r="5" fill="#c07f26"/> <circle cx="-5" cy="-94" r="5" fill="#c07f26"/> <!-- 脸 --> <circle cx="-30" cy="-66" r="32" fill="#f2b558"/> <!-- 吻部 + 鼻子 + 嘴 --> <ellipse cx="-30" cy="-54" rx="15" ry="10" fill="#fbe3bd"/> <path d="M -36 -58 Q -30 -64 -24 -58 Q -30 -55 -36 -58 Z" fill="#7a4a1e"/> <path d="M -30 -51 Q -38 -45 -44 -47" stroke="#7a4a1e" stroke-width="2" fill="none" stroke-linecap="round"/> <path d="M -30 -51 Q -22 -45 -16 -47" stroke="#7a4a1e" stroke-width="2" fill="none" stroke-linecap="round"/> <!-- 腮红 --> <circle cx="-48" cy="-52" r="4" fill="#f58f4a" opacity="0.55"/> <circle cx="-12" cy="-52" r="4" fill="#f58f4a" opacity="0.55"/> <!-- 胡须 --> <g stroke="#7a4a1e" stroke-width="1.8" opacity="0.45" stroke-linecap="round"> <line x1="-44" y1="-58" x2="-58" y2="-60"/> <line x1="-44" y1="-55" x2="-59" y2="-53"/> <line x1="-44" y1="-52" x2="-57" y2="-47"/> <line x1="-16" y1="-58" x2="-2" y2="-60"/> <line x1="-16" y1="-55" x2="-1" y2="-53"/> <line x1="-16" y1="-52" x2="-3" y2="-47"/> </g> <!-- 飞行护目镜 --> <path d="M -60 -78 Q -30 -100 0 -78" stroke="#7a4a1e" stroke-width="7" fill="none"/> <circle cx="-39" cy="-74" r="10.5" fill="#2c5d86" stroke="#1e3d59" stroke-width="2"/> <circle cx="-21" cy="-74" r="10.5" fill="#2c5d86" stroke="#1e3d59" stroke-width="2"/> <rect x="-32" y="-77" width="11" height="4" rx="2" fill="#7a4a1e"/> <path d="M -43 -78 Q -39 -81 -35 -78" stroke="#ffffff" stroke-width="2" fill="none" opacity="0.7" stroke-linecap="round"/> <path d="M -25 -78 Q -21 -81 -17 -78" stroke="#ffffff" stroke-width="2" fill="none" opacity="0.7" stroke-linecap="round"/> <!-- 爪子 --> <ellipse cx="-46" cy="-22" rx="10" ry="7" fill="#f2b558" stroke="#d18a1f" stroke-width="1.5"/> <ellipse cx="-14" cy="-22" rx="10" ry="7" fill="#f2b558" stroke="#d18a1f" stroke-width="1.5"/> <line x1="-50" y1="-22" x2="-50" y2="-17" stroke="#b06f1d" stroke-width="1.5"/> <line x1="-44" y1="-22" x2="-44" y2="-17" stroke="#b06f1d" stroke-width="1.5"/> <line x1="-18" y1="-22" x2="-18" y2="-17" stroke="#b06f1d" stroke-width="1.5"/> <line x1="-12" y1="-22" x2="-12" y2="-17" stroke="#b06f1d" stroke-width="1.5"/> </g> <!-- 座舱前缘 --> <path d="M -64 -25 Q -40 -16 -16 -25" stroke="#b8351f" stroke-width="7" fill="none" stroke-linecap="round"/> <!-- 风挡 --> <path d="M -8 -32 Q 4 -54 18 -34" stroke="#dff4ff" stroke-width="6" fill="none" opacity="0.85" stroke-linecap="round"/> <!-- 围巾(迎风飘扬) --> <path fill="#ff4d4d" stroke="#d63b2b" stroke-width="2"> <animate attributeName="d" values="M -40 -44 C -70 -38 -100 -52 -150 -40 C -108 -22 -72 -20 -46 -30 Z; M -40 -44 C -70 -50 -100 -34 -150 -44 C -108 -24 -72 -32 -46 -36 Z; M -40 -44 C -70 -32 -100 -58 -150 -36 C -108 -26 -72 -14 -46 -26 Z; M -40 -44 C -70 -38 -100 -52 -150 -40 C -108 -22 -72 -20 -46 -30 Z" keyTimes="0;0.33;0.66;1" calcMode="spline" keySplines="0.4 0 0.6 1;0.4 0 0.6 1;0.4 0 0.6 1" dur="1.3s" repeatCount="indefinite"/> </path> <circle cx="-36" cy="-40" r="11" fill="#e03e2f"/> <circle cx="-36" cy="-40" r="5.5" fill="#c0351c"/> <!-- 上翼 + 翼间支柱 --> <line x1="-118" y1="-102" x2="-118" y2="62" stroke="#7a4a1e" stroke-width="5" stroke-linecap="round"/> <line x1="52" y1="-102" x2="52" y2="62" stroke="#7a4a1e" stroke-width="5" stroke-linecap="round"/> <rect x="-135" y="-132" width="280" height="30" rx="13" fill="#f6d365" stroke="#c98a1f" stroke-width="3"/> <rect x="-28" y="-132" width="26" height="30" rx="6" fill="#e8482f"/> <!-- 螺旋桨:静止光晕 + 高速旋转桨叶 --> <ellipse cx="132" cy="0" rx="50" ry="13" fill="#ffffff" opacity="0.18"/> <circle cx="132" cy="0" r="10" fill="#6b5234"/> <circle cx="132" cy="0" r="3.5" fill="#f0d9a8"/> <g transform="translate(132,0)"> <g> <animateTransform attributeName="transform" type="rotate" from="0" to="360" dur="0.09s" repeatCount="indefinite"/> <path d="M 0 -8 C 24 -10 46 -5 62 0 C 46 5 24 10 0 8 Z" fill="#4e3d2a"/> <path d="M 0 -8 C 24 -10 46 -5 62 0 C 46 5 24 10 0 8 Z" fill="#4e3d2a" transform="rotate(180)"/> </g> </g> </g> </g> </g> <!-- ============ 近层云(快速,会从飞机前掠过) ============ --> <g transform="translate(1600,530) scale(1.05)"> <g><animateTransform attributeName="transform" type="translate" from="0 0" to="-2000 0" dur="45s" begin="-14s" repeatCount="indefinite"/><use href="#cloud" opacity="0.95"/></g> </g> <g transform="translate(1580,360) scale(1.05)"> <g><animateTransform attributeName="transform" type="translate" from="0 0" to="-2000 0" dur="52s" begin="-34s" repeatCount="indefinite"/><use href="#cloud" opacity="0.93"/></g> </g> <!-- ============ 小鸟 ============ --> <g transform="translate(1330,160)"> <g> <animateTransform attributeName="transform" type="translate" from="0 0" to="-1950 0" dur="100s" begin="-30s" repeatCount="indefinite"/> <g> <animateTransform attributeName="transform" type="scale" values="1 1; 1 0.35; 1 1" keyTimes="0;0.5;1" dur="0.9s" repeatCount="indefinite"/> <path d="M -11 0 Q -5 -6 0 0 Q 5 -6 11 0" stroke="#4a5568" stroke-width="3" fill="none" stroke-linecap="round"/> </g> </g> </g> <g transform="translate(1410,120) scale(0.75)"> <g> <animateTransform attributeName="transform" type="translate" from="0 0" to="-2000 0" dur="125s" begin="-85s" repeatCount="indefinite"/> <g> <animateTransform attributeName="transform" type="scale" values="1 1; 1 0.35; 1 1" keyTimes="0;0.5;1" dur="0.9s" repeatCount="indefinite"/> <path d="M -11 0 Q -5 -6 0 0 Q 5 -6 11 0" stroke="#4a5568" stroke-width="3" fill="none" stroke-linecap="round"/> </g> </g> </g> </svg> </div> </body> </html> ```**DeepSeek Harness:**

<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>狮子开飞机 · SVG 2D 动画</title> <style> html, body { margin: 0; padding: 0; height: 100%; background: linear-gradient(180deg, #0b3d6b, #164a7d); overflow: hidden; font-family: "PingFang SC", "Microsoft YaHei", "Kaiti SC", sans-serif; } .stage { position: relative; width: 100vw; height: 100vh; display: flex; align-items: center; justify-content: center; } svg { height: 100vh; width: auto; max-width: 100vw; display: block; } .title { position: absolute; top: 4%; left: 50%; transform: translateX(-50%); margin: 0; font-size: clamp(26px, 4.5vw, 52px); font-weight: 900; color: #fff7d6; text-shadow: 0 3px 0 #b5651d, 0 6px 14px rgba(0, 0, 0, .45); letter-spacing: .12em; animation: titlefloat 3s ease-in-out infinite; white-space: nowrap; } .badge { position: absolute; top: calc(4% + clamp(46px, 7vw, 84px)); left: 50%; transform: translateX(-50%); background: rgba(255, 255, 255, .82); color: #7a2e26; font-size: clamp(12px, 1.6vw, 16px); padding: 5px 18px; border-radius: 999px; box-shadow: 0 3px 10px rgba(0, 0, 0, .25); white-space: nowrap; } .footer { position: absolute; bottom: 2%; left: 50%; transform: translateX(-50%); color: rgba(255, 255, 255, .85); font-size: 13px; letter-spacing: .08em; white-space: nowrap; } @keyframes titlefloat { 0%, 100% { margin-top: 0; } 50% { margin-top: -8px; } } /* ---------- 飞机整体起伏 ---------- */ .plane-bob { animation: bob 3.4s ease-in-out infinite; transform-origin: 600px 420px; } @keyframes bob { 0% { transform: translateY(0) rotate(-1.6deg); } 50% { transform: translateY(-22px) rotate(1.4deg); } 100% { transform: translateY(0) rotate(-1.6deg); } } /* ---------- 螺旋桨 ---------- */ .prop { animation: spin .16s linear infinite; transform-box: fill-box; transform-origin: center; } @keyframes spin { to { transform: rotate(360deg); } } /* ---------- 围巾飘动 ---------- */ .scarf { animation: flutter .8s ease-in-out infinite alternate; transform-box: fill-box; transform-origin: 88% 55%; } .scarf2 { animation: flutter .65s ease-in-out .15s infinite alternate; transform-box: fill-box; transform-origin: 90% 60%; } @keyframes flutter { from { transform: rotate(-7deg) skewY(-3deg); } to { transform: rotate(9deg) skewY(5deg); } } /* ---------- 尾气烟圈 ---------- */ .puff { animation: puffmove 2.8s linear infinite; } @keyframes puffmove { 0% { transform: translate(0, 0) scale(.6); opacity: 0; } 15% { opacity: .85; } 100% { transform: translate(-680px, -26px) scale(2.2); opacity: 0; } } /* ---------- 速度线 ---------- */ .speedline { animation: linemove 1.2s linear infinite; } @keyframes linemove { 0% { transform: translateX(0); opacity: 0; } 25% { opacity: .8; } 100% { transform: translateX(-760px); opacity: 0; } } /* ---------- 云 ---------- */ .cloud { animation: drift linear infinite; } @keyframes drift { from { transform: translateX(1280px); } to { transform: translateX(-420px); } } /* ---------- 飞鸟 ---------- */ .bird { animation: fly linear infinite; } @keyframes fly { from { transform: translateX(1320px); } to { transform: translateX(-120px); } } /* ---------- 太阳光芒 ---------- */ .rays { animation: rayrot 26s linear infinite; transform-box: fill-box; transform-origin: center; } @keyframes rayrot { to { transform: rotate(360deg); } } /* ---------- 地面滚动 ---------- */ .ground { animation: groundmove 24s linear infinite; } @keyframes groundmove { to { transform: translateX(-1200px); } } </style> </head> <body> <div class="stage"> <svg viewBox="0 0 1200 800" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="狮子开飞机 2D 动画"> <defs> <linearGradient id="skyGrad" x1="0" y1="0" x2="0" y2="1"> <stop offset="0%" stop-color="#6fbff0"/> <stop offset="100%" stop-color="#e3f5ff"/> </linearGradient> </defs> <!-- 天空 --> <rect width="1200" height="800" fill="url(#skyGrad)"/> <!-- 太阳与光芒 --> <g transform="translate(150, 120)"> <g class="rays"> <rect x="-5" y="-88" width="10" height="26" rx="5" fill="#ffd166" opacity=".9"/> <rect x="-5" y="-88" width="10" height="26" rx="5" fill="#ffd166" opacity=".9" transform="rotate(30)"/> <rect x="-5" y="-88" width="10" height="26" rx="5" fill="#ffd166" opacity=".9" transform="rotate(60)"/> <rect x="-5" y="-88" width="10" height="26" rx="5" fill="#ffd166" opacity=".9" transform="rotate(90)"/> <rect x="-5" y="-88" width="10" height="26" rx="5" fill="#ffd166" opacity=".9" transform="rotate(120)"/> <rect x="-5" y="-88" width="10" height="26" rx="5" fill="#ffd166" opacity=".9" transform="rotate(150)"/> <rect x="-5" y="-88" width="10" height="26" rx="5" fill="#ffd166" opacity=".9" transform="rotate(180)"/> <rect x="-5" y="-88" width="10" height="26" rx="5" fill="#ffd166" opacity=".9" transform="rotate(210)"/> <rect x="-5" y="-88" width="10" height="26" rx="5" fill="#ffd166" opacity=".9" transform="rotate(240)"/> <rect x="-5" y="-88" width="10" height="26" rx="5" fill="#ffd166" opacity=".9" transform="rotate(270)"/> <rect x="-5" y="-88" width="10" height="26" rx="5" fill="#ffd166" opacity=".9" transform="rotate(300)"/> <rect x="-5" y="-88" width="10" height="26" rx="5" fill="#ffd166" opacity=".9" transform="rotate(330)"/> </g> <circle r="52" fill="#ffd166"/> <circle r="44" fill="#ffe9a3"/> </g> <!-- 云(远景、中景) --> <g transform="translate(0, 90) scale(1.1)"> <g class="cloud" style="animation-duration: 30s; animation-delay: -5s;"> <g fill="#ffffff" opacity=".95"> <circle cx="40" cy="0" r="34"/> <circle cx="85" cy="-16" r="40"/> <circle cx="132" cy="-2" r="30"/> <rect x="30" y="-2" width="115" height="30" rx="15"/> </g> </g> </g> <g transform="translate(0, 300) scale(.9)"> <g class="cloud" style="animation-duration: 36s; animation-delay: -27s;"> <g fill="#ffffff" opacity=".9"> <circle cx="40" cy="0" r="34"/> <circle cx="85" cy="-16" r="40"/> <circle cx="132" cy="-2" r="30"/> <rect x="30" y="-2" width="115" height="30" rx="15"/> </g> </g> </g> <g transform="translate(0, 210) scale(.7)"> <g class="cloud" style="animation-duration: 42s; animation-delay: -18s;"> <g fill="#ffffff" opacity=".8"> <circle cx="40" cy="0" r="34"/> <circle cx="85" cy="-16" r="40"/> <circle cx="132" cy="-2" r="30"/> <rect x="30" y="-2" width="115" height="30" rx="15"/> </g> </g> </g> <g transform="translate(0, 70) scale(.5)"> <g class="cloud" style="animation-duration: 55s; animation-delay: -40s;"> <g fill="#ffffff" opacity=".7"> <circle cx="40" cy="0" r="34"/> <circle cx="85" cy="-16" r="40"/> <circle cx="132" cy="-2" r="30"/> <rect x="30" y="-2" width="115" height="30" rx="15"/> </g> </g> </g> <!-- 飞鸟 --> <g transform="translate(0, 130)"> <g class="bird" style="animation-duration: 34s; animation-delay: -12s;"> <path d="M0 0 Q 8 -10 16 0 Q 24 -10 32 0" stroke="#2c3e50" stroke-width="3.5" fill="none" stroke-linecap="round"/> </g> </g> <g transform="translate(0, 185)"> <g class="bird" style="animation-duration: 27s; animation-delay: -21s;"> <path d="M0 0 Q 8 -10 16 0 Q 24 -10 32 0" stroke="#2c3e50" stroke-width="3" fill="none" stroke-linecap="round" opacity=".85"/> </g> </g> <!-- 地面(无缝循环滚动) --> <g class="ground"> <g> <ellipse cx="280" cy="800" rx="480" ry="150" fill="#b7dba0"/> <ellipse cx="820" cy="812" rx="520" ry="170" fill="#8fc270"/> <g transform="translate(160, 715)"> <rect x="-5" y="0" width="10" height="28" fill="#6f4e37"/> <polygon points="0,-80 -24,0 24,0" fill="#3e7d32"/> <polygon points="0,-58 -17,8 17,8" fill="#4e8f3f"/> </g> <g transform="translate(430, 695)"> <rect x="-5" y="0" width="10" height="28" fill="#6f4e37"/> <polygon points="0,-80 -24,0 24,0" fill="#3e7d32"/> <polygon points="0,-58 -17,8 17,8" fill="#4e8f3f"/> </g> <g transform="translate(720, 730)"> <rect x="-5" y="0" width="10" height="28" fill="#6f4e37"/> <polygon points="0,-80 -24,0 24,0" fill="#3e7d32"/> <polygon points="0,-58 -17,8 17,8" fill="#4e8f3f"/> </g> <g transform="translate(1030, 700)"> <rect x="-5" y="0" width="10" height="28" fill="#6f4e37"/> <polygon points="0,-80 -24,0 24,0" fill="#3e7d32"/> <polygon points="0,-58 -17,8 17,8" fill="#4e8f3f"/> </g> </g> <g transform="translate(1200, 0)"> <ellipse cx="280" cy="800" rx="480" ry="150" fill="#b7dba0"/> <ellipse cx="820" cy="812" rx="520" ry="170" fill="#8fc270"/> <g transform="translate(160, 715)"> <rect x="-5" y="0" width="10" height="28" fill="#6f4e37"/> <polygon points="0,-80 -24,0 24,0" fill="#3e7d32"/> <polygon points="0,-58 -17,8 17,8" fill="#4e8f3f"/> </g> <g transform="translate(430, 695)"> <rect x="-5" y="0" width="10" height="28" fill="#6f4e37"/> <polygon points="0,-80 -24,0 24,0" fill="#3e7d32"/> <polygon points="0,-58 -17,8 17,8" fill="#4e8f3f"/> </g> <g transform="translate(720, 730)"> <rect x="-5" y="0" width="10" height="28" fill="#6f4e37"/> <polygon points="0,-80 -24,0 24,0" fill="#3e7d32"/> <polygon points="0,-58 -17,8 17,8" fill="#4e8f3f"/> </g> <g transform="translate(1030, 700)"> <rect x="-5" y="0" width="10" height="28" fill="#6f4e37"/> <polygon points="0,-80 -24,0 24,0" fill="#3e7d32"/> <polygon points="0,-58 -17,8 17,8" fill="#4e8f3f"/> </g> </g> </g> <!-- ============ 飞机 ============ --> <g class="plane-bob"> <g transform="translate(600, 420) rotate(-4)"> <!-- 尾翼 --> <ellipse cx="-218" cy="-16" rx="54" ry="13" fill="#e63946"/> <path d="M -240 -6 C -262 -16 -276 -58 -258 -84 C -242 -58 -218 -38 -220 -8 Z" fill="#c1121f"/> <path d="M -238 -22 C -250 -26 -258 -50 -250 -68 C -240 -50 -228 -34 -228 -22 Z" fill="#a41623" opacity=".8"/> <!-- 机身 --> <rect x="-235" y="-42" width="460" height="84" rx="42" fill="#e63946"/> <ellipse cx="-20" cy="10" rx="165" ry="30" fill="#f6c67f"/> <rect x="-212" y="-32" width="340" height="12" rx="6" fill="#fff3e0" opacity=".95"/> <text x="-168" y="-6" font-size="22" font-weight="bold" fill="#7a2e26" font-family="'Trebuchet MS', sans-serif">LION-1</text> <!-- 驾驶舱开口 --> <ellipse cx="30" cy="-28" rx="95" ry="42" fill="#3a0d0d"/> <ellipse cx="22" cy="-26" rx="42" ry="24" fill="#e8a33d"/> <!-- ===== 狮子飞行员 ===== --> <!-- 鬃毛 --> <path d="M -6.6 -98 L -26.1 -92.5 L -12 -78 L -26.1 -63.5 L -6.6 -58 L -11.6 -38.4 L 8 -43.4 L 13.5 -23.9 L 28 -38 L 42.5 -23.9 L 48 -43.4 L 67.6 -38.4 L 62.6 -58 L 82.1 -63.5 L 68 -78 L 82.1 -92.5 L 62.6 -98 Z" fill="#d97b1f"/> <!-- 耳朵 --> <circle cx="-2" cy="-98" r="10" fill="#d97706"/> <circle cx="-2" cy="-98" r="5" fill="#f6b93b"/> <circle cx="58" cy="-102" r="10" fill="#d97706"/> <circle cx="58" cy="-102" r="5" fill="#f6b93b"/> <!-- 脸 --> <circle cx="30" cy="-78" r="28" fill="#f6b93b"/> <!-- 口鼻 --> <ellipse cx="60" cy="-66" rx="15" ry="11" fill="#fbe5c8"/> <circle cx="66" cy="-70" r="4" fill="#3d2b1f"/> <path d="M 46 -58 Q 54 -52 62 -54" stroke="#4a2c2a" stroke-width="2" fill="none" stroke-linecap="round"/> <!-- 胡须 --> <line x1="48" y1="-66" x2="20" y2="-62" stroke="#4a2c2a" stroke-width="1.5" opacity=".6"/> <line x1="48" y1="-64" x2="18" y2="-70" stroke="#4a2c2a" stroke-width="1.5" opacity=".6"/> <line x1="48" y1="-62" x2="22" y2="-58" stroke="#4a2c2a" stroke-width="1.5" opacity=".6"/> <!-- 飞行帽 --> <path d="M -24 -86 Q 26 -114 66 -84 Q 28 -100 -24 -86 Z" fill="#8b4513"/> <path d="M 60 -84 Q 78 -82 80 -72 Q 66 -80 56 -82 Z" fill="#6d3410"/> <!-- 护目镜 --> <path d="M -12 -66 Q 28 -58 66 -70" stroke="#5c3a21" stroke-width="6" fill="none"/> <path d="M -14 -88 Q 30 -102 72 -86" stroke="#5c3a21" stroke-width="5" fill="none"/> <circle cx="46" cy="-80" r="11" fill="#cfe8ff" stroke="#5c3a21" stroke-width="3"/> <circle cx="50" cy="-80" r="4" fill="#222222"/> <circle cx="51.5" cy="-81.5" r="1.5" fill="#ffffff"/> <!-- 红围巾 --> <path class="scarf2" d="M 8 -44 C -14 -32 -42 -36 -72 -28 C -64 -12 -30 -10 -4 -22 Z" fill="#b01f24"/> <path class="scarf" d="M 14 -50 C -6 -40 -34 -54 -70 -44 C -60 -28 -30 -20 -2 -32 Z" fill="#d62828"/> <circle cx="18" cy="-52" r="8" fill="#b01f24"/> <!-- 操纵杆与爪子 --> <line x1="100" y1="6" x2="108" y2="-34" stroke="#5c3a21" stroke-width="5" stroke-linecap="round"/> <circle cx="108" cy="-36" r="7" fill="#3f2a14"/> <circle cx="72" cy="-10" r="9" fill="#f6b93b"/> <line x1="66" y1="-14" x2="68" y2="-6" stroke="#d97b1f" stroke-width="2" stroke-linecap="round"/> <line x1="73" y1="-16" x2="73" y2="-5" stroke="#d97b1f" stroke-width="2" stroke-linecap="round"/> <circle cx="110" cy="-32" r="9" fill="#f6b93b"/> <line x1="105" y1="-36" x2="106" y2="-26" stroke="#d97b1f" stroke-width="2" stroke-linecap="round"/> <line x1="113" y1="-37" x2="112" y2="-26" stroke="#d97b1f" stroke-width="2" stroke-linecap="round"/> <!-- 座舱圈与风挡 --> <path d="M -62 -16 A 94 44 0 0 1 126 -50" stroke="#7f1d1d" stroke-width="8" fill="none" stroke-linecap="round"/> <path d="M -62 -16 A 94 44 0 0 0 126 -50" stroke="#7f1d1d" stroke-width="8" fill="none" stroke-linecap="round"/> <path d="M 112 -10 C 122 -46 152 -58 172 -34 L 172 -2 C 152 -12 134 -8 112 -2 Z" fill="#bfe3ff" opacity=".75" stroke="#264653" stroke-width="4" stroke-linejoin="round"/> <!-- 机翼支柱 --> <line x1="-128" y1="-40" x2="-122" y2="-122" stroke="#6d4c41" stroke-width="6" stroke-linecap="round"/> <line x1="120" y1="-40" x2="124" y2="-122" stroke="#6d4c41" stroke-width="6" stroke-linecap="round"/> <!-- 上翼 --> <g transform="rotate(-2)"> <rect x="-150" y="-150" width="300" height="30" rx="15" fill="#f4a261" stroke="#c77b3f" stroke-width="3"/> <line x1="-100" y1="-148" x2="-100" y2="-122" stroke="#c77b3f" stroke-width="2" opacity=".55"/> <line x1="-30" y1="-149" x2="-30" y2="-121" stroke="#c77b3f" stroke-width="2" opacity=".55"/> <line x1="40" y1="-149" x2="40" y2="-121" stroke="#c77b3f" stroke-width="2" opacity=".55"/> <line x1="110" y1="-148" x2="110" y2="-122" stroke="#c77b3f" stroke-width="2" opacity=".55"/> </g> <!-- 下翼 --> <rect x="-120" y="16" width="250" height="28" rx="14" fill="#f4a261" stroke="#c77b3f" stroke-width="3"/> <line x1="-70" y1="17" x2="-70" y2="43" stroke="#c77b3f" stroke-width="2" opacity=".55"/> <line x1="0" y1="17" x2="0" y2="43" stroke="#c77b3f" stroke-width="2" opacity=".55"/> <line x1="70" y1="17" x2="70" y2="43" stroke="#c77b3f" stroke-width="2" opacity=".55"/> <!-- 发动机罩与机鼻 --> <ellipse cx="205" cy="-8" rx="58" ry="46" fill="#b51f2b"/> <ellipse cx="190" cy="-30" rx="24" ry="10" fill="#ffffff" opacity=".25"/> <ellipse cx="258" cy="-8" rx="15" ry="34" fill="#fdf0d5" stroke="#d9b98a" stroke-width="2"/> <!-- 起落架 --> <line x1="150" y1="30" x2="156" y2="86" stroke="#4a2c2a" stroke-width="5" stroke-linecap="round"/> <line x1="192" y1="30" x2="198" y2="86" stroke="#4a2c2a" stroke-width="5" stroke-linecap="round"/> <line x1="140" y1="88" x2="214" y2="88" stroke="#4a2c2a" stroke-width="4"/> <circle cx="156" cy="94" r="13" fill="#333333" stroke="#111111" stroke-width="3"/> <circle cx="156" cy="94" r="5" fill="#f1faee"/> <circle cx="200" cy="94" r="13" fill="#333333" stroke="#111111" stroke-width="3"/> <circle cx="200" cy="94" r="5" fill="#f1faee"/> <!-- 螺旋桨 --> <g transform="translate(272, -8)"> <ellipse cx="0" cy="0" rx="7" ry="44" fill="#264653" opacity=".22"/> <ellipse cx="0" cy="0" rx="4" ry="38" fill="#264653" opacity=".18"/> <g class="prop"> <ellipse cx="0" cy="-36" rx="9" ry="36" fill="#264653" opacity=".9"/> <ellipse cx="0" cy="-36" rx="9" ry="36" fill="#264653" opacity=".9" transform="rotate(120)"/> <ellipse cx="0" cy="-36" rx="9" ry="36" fill="#264653" opacity=".9" transform="rotate(240)"/> <circle r="9" fill="#7f1d1d" stroke="#f1faee" stroke-width="2"/> </g> </g> <!-- 尾气 --> <g transform="translate(292, -10)"> <g class="puff" style="animation-delay: 0s;"> <circle cx="0" cy="0" r="9" fill="#f0f8ff" opacity=".8"/> <circle cx="10" cy="-4" r="7" fill="#f0f8ff" opacity=".7"/> </g> <g class="puff" style="animation-delay: -1.4s;"> <circle cx="0" cy="0" r="9" fill="#f0f8ff" opacity=".8"/> <circle cx="10" cy="-4" r="7" fill="#f0f8ff" opacity=".7"/> </g> </g> <!-- 速度线 --> <g transform="translate(-250, -64)"> <line class="speedline" x1="0" y1="0" x2="66" y2="0" stroke="#ffffff" stroke-width="4" stroke-linecap="round" opacity=".7" style="animation-duration: 1.1s;"/> </g> <g transform="translate(-282, -2)"> <line class="speedline" x1="0" y1="0" x2="66" y2="0" stroke="#ffffff" stroke-width="4" stroke-linecap="round" opacity=".7" style="animation-duration: .9s; animation-delay: -.5s;"/> </g> <g transform="translate(-252, 44)"> <line class="speedline" x1="0" y1="0" x2="66" y2="0" stroke="#ffffff" stroke-width="4" stroke-linecap="round" opacity=".7" style="animation-duration: 1.3s; animation-delay: -.3s;"/> </g> </g> </g> </svg> <h1 class="title">🦁 狮子开飞机 ✈</h1> <div class="badge">SVG · CSS 2D 动画</div> <div class="footer">纯 SVG + CSS 动画 · 无 JavaScript</div> </div> </body> </html>主楼 - best_joker2026-08-1362811
这是flah接入claude code的

这是flash接入dsh的

这是pro接入cc的

这是pro接入dsh的


这几个都是text-only模型,提示词:```
生成html,内容是SVG绘制狮子开飞机2D动画,不需要测试
```svg对于这种纯文本的模型证明不了什么,但是目前来看,ds-pro确实是一坨
明明flash体量的模型那么NB,哈吉梁,你要干什么
