index.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta name="referrer" content="no-referrer" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="shortcut icon" href="./iocn.png" />
    <link rel="preload stylesheet" href="./css/style.css" as="style" />
    <link rel="preload" as="script" href="dist/bundle.js" crossorigin="anonymous" />
    <link rel="preload" href="./fonts/汉仪文黑-85W.ttf" as="font" type="font/ttf" crossorigin="anonymous" />
    <link rel="preload" href="./cursor/normal.ani" as="fetch" type="application/octet-stream" crossorigin="anonymous" />
    <title>碧瑶的个人空间</title>
  </head>
  <body>
    <div class="video-box">
      <video class="video-background" preload="auto" loop playsinline autoplay src="./bg.mp4" tabindex="-1" muted="muted"></video>
      <div class="layer">
        <img src="./by.png" class="fade-in" alt="log" />
        <div class="slogan">
          <div class="subtitle fade-in">碧瑶的专属个人网站</div>
          <div class="title fade-in">伤心花开人未还</div>
          <div id="try-btn" class="try-btn fade-in" onclick="postNow()" tabindex="0">立即参与</div>
        </div>
        <div class="author fade-in"><img src="./雨落制作,落款.png" ale="雨落制作" /></div>
      </div>
      <div class="music-btn fade-in">
        <img src="./iocn/music50-off.png" class="music" id="music" />
      </div>
    </div>
    <div class="content">
      <div class="avatar-box">
        <img class="avatar" src="./by.png" alt="未来" />
        <p class="nickname">未来</p>
      </div>
    </div>
    <script type="module" src="./dist/bundle.js" defer ;></script>
  </body>
</html>