three做个三维国庆节快乐特效代码-html代码-BFW代码库

three做个三维国庆节快乐特效代码

代码语言：html

所属分类：其他

代码由qwen-3.8-max 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">
<title>国庆节快乐 · 天安门 | 三维数字贺岁</title>
<link href="https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;600;900&display=swap" rel="stylesheet">
<style>
  *{margin:0;padding:0;box-sizing:border-box}
  html,body{width:100%;height:100%;overflow:hidden;background:#0e0b08;
    font-family:'Noto Serif SC','Songti SC','STSong','SimSun',serif;color:#d8b46a;
    -webkit-user-select:none;user-select:none}
  #bgGlow{position:fixed;inset:0;background:
    radial-gradient(ellipse 60% 45% at 50% 62%, rgba(216,164,72,.16), transparent 65%),
    radial-gradient(ellipse 70% 40% at 50% 0%, rgba(255,60,40,.10), transparent 70%),
    radial-gradient(ellipse 90% 70% at 50% 50%, #1a1410, #0e0b08 80%);}
  canvas#webgl{position:fixed;inset:0;display:block;cursor:grab;
    filter:drop-shadow(0 0 4px rgba(255,196,100,.45)) drop-shadow(0 0 14px rgba(255,150,40,.22));}
  canvas#webgl:active{cursor:grabbing}
  #vignette{position:fixed;inset:0;pointer-events:none;
    background:radial-gradient(ellipse 75% 65% at 50% 50%, transparent 55%, rgba(0,0,0,.62));}
  #scan{position:fixed;inset:0;pointer-events:none;opacity:.5;
    background:repeating-linear-gradient(0deg, rgba(255,255,255,.015) 0 1px, transparent 1px 4px);}

  /* ============ UI ============ */
  #ui{position:fixed;inset:0;pointer-events:none;z-index:5}
  #ui button,#ui .play,#ui .closeBtn{pointer-events:auto}

  .topMid{position:absolute;top:22px;left:50%;transform:translateX(-50%);
    text-align:center;letter-spacing:.35em;font-size:11px;opacity:.8}
  .topMid .en{display:block;font-size:8px;letter-spacing:.42em;opacity:.55;margin-top:5px;
    font-family:Georgia,serif}

  .left{position:absolute;left:52px;top:44px}
  .mingWrap{position:relative;display:inline-block}
  h1.ming{font-size:clamp(72px,10vw,116px);font-weight:900;line-height:1;letter-spacing:.06em;
    background:linear-gradient(180deg,#f7e6bb 10%,#d8b46a 55%,#a97e35 95%);
    -webkit-background-clip:text;background-clip:text;color:transparent;
    text-shadow:0 0 30px rgba(216,180,106,.25)}
  .seal{position:absolute;top:2px;right:-46px;width:34px;height:44px;background:#a3302a;
    color:#f5e8d8.........完整代码请登录后点击上方下载按钮下载查看