宅家情人节，用代码构建独一无二的时光回忆录

2023-12-02 09:22:05

时光回忆录：用代码构建情人节礼物

在这个因疫情而变得特殊的 Valentine's Day，让我们的爱在代码中升华。做一款“时光回忆录”小软件，将你们的点滴瞬间凝结成永恒。

爱的登录界面：代码中的浪漫密钥

时光回忆录的第一关，就是登录界面。输入你的名字和你的 TA 的名字，就像打开一扇爱的密室，踏入属于你们两个的甜蜜世界。

<form>
  <label for="yourName">你的名字：</label>
  <input type="text" id="yourName" />

  <label for="taName">TA 的名字：</label>
  <input type="text" id="taName" />

  <input type="submit" value="进入时光回忆录" />
</form>

时光宝盒：收藏你们专属的珍宝

登录后，映入眼帘的是一个时光宝盒。在这里，你们可以存放你们在一起的每一份美好回忆：甜蜜的照片、温馨的视频、浪漫的文字。

<div id="treasureBox">
  <div class="memoryItem">
    <img src="memory1.jpg" />
    <p>2023 年 2 月 14 日，我们的第一次约会</p>
  </div>

  <div class="memoryItem">
    <video src="memory2.mp4" />
    <p>2023 年 3 月 8 日，我们的第一次海边旅行</p>
  </div>

  <div class="memoryItem">
    <p>2023 年 5 月 20 日，我写给 TA 的情诗</p>
  </div>
</div>

时光轴：见证爱的轨迹

时光宝盒的下方，是一条时光轴。它记录着你们相爱的每一天，每一个值得纪念的时刻。点击不同的日期，就能重温当时的甜蜜。

<ul id="timeline">
  <li>
    <a href="#">2023 年 2 月 14 日</a>
  </li>

  <li>
    <a href="#">2023 年 3 月 8 日</a>
  </li>

  <li>
    <a href="#">2023 年 5 月 20 日</a>
  </li>
</ul>