three做个三维中秋节快乐场景代码-html代码-BFW代码库

three做个三维中秋节快乐场景代码

代码语言：html

所属分类：其他

代码由deepseek-4.1-flash ai生成，可能有错误，仅供参考：点击查看提示词

代码描述：中秋节快乐

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>中秋之夜 · 圆月与烟花</title>
<style>
  * { margin: 0; padding: 0; box-sizing: border-box; }
  html, body { width: 100%; height: 100%; overflow: hidden; }
  body {
    background: radial-gradient(ellipse 130% 90% at 50% 115%,
      #2a1f5e 0%,
      #171042 25%,
      #0a0722 55%,
      #030210 80%,
      #000004 100%);
  }
  canvas { display: block; position: fixed; inset: 0; }

  #title {
    position: fixed;
    left: 50%;
    bottom: 9%;
    transform: translateX(-50%);
    font-family: "Songti SC", "STSong", "SimSun", "Noto Serif SC", serif;
    font-size: clamp(20px, 3.4vw, 42px);
    font-weight: 500;
    color: #fff0c8;
    letter-spacing: 0.42em;
    text-indent: 0.42em;
    white-space: nowrap;
    user-select: none;
    pointer-events: none;
    text-shadow:
      0 0 12px rgba(255, 226, 150, 0.9),
      0 0 40px rgba(255, 186, 80, 0.55),
      0 0 90px rgba(255, 150, 40, 0.3);
    opacity: 0;
    animation: fadeUp 3.2s cubic-bezier(.22,.9,.3,1) 0.8s forwards;
  }
  @keyframes fadeUp {
    0%   { opacity: 0; transform: translateX(-50%) translateY(18px); filter: blur(6px); }
    100% { opacity: 1; transform: translateX(-50%) translateY(0);   filter: blur(0); }
  }

  #hint {
    position: fixed;
    left: 50%;
    bottom: 3.5%;
    transform: translateX(-50%);
    font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
    font-size: 12px;
    letter-spacing: 0.18em;
    color: rgba(255, 235, 190, 0.35);
    user-select: none;
    pointer-events: none;
    opacity: 0;
    animation: fadeIn 2.5s ease 3.5s forwards;
  }
  @keyframes fadeIn { to { opacity: 1; } }
</style>
</head>
<body>

<div id="title">中秋快乐 · 花好月圆</div>
<div id="hint">点击屏幕，绽放属于你的烟花</div>

<script type="importmap">
{
  "imports": {
    "three": "https://unpkg.com/three@0.160.0/build/three.module.js"
  }
}
</script>

<script ty.........完整代码请登录后点击上方下载按钮下载查看