主页

返回

日记页面

日记内容编写规范与页面功能说明

日记文件结构#

日记文件存放在 src/content/diary/ 目录下，使用 Markdown 格式，文件名建议使用日期格式如 20260209D01.md。其中20260209表示日期，D01表示第几篇日记，D02表示第二篇日记，以此类推。

Frontmatter 配置#

---
title: ' '                    # 标题（可选）
publishDate: 2026-02-09       # 发布日期（必填）
comment: ''                   # 日记的评论/感想（可选，貌似多此一举）
images:                       # 图片列表（可选）
  - /path/to/image.jpg
tooltips:                     # 标注定义（可选）
  关键词: 解释内容
---
yaml

Tooltip 标注功能#

日记支持为特定词汇添加悬浮提示，鼠标移上去会显示解释内容。

使用方法#

1. 在 frontmatter 中定义标注内容：

tooltips:
  归零之日: 《三角洲行动》赛季任务
  标杆的飞升: 《三角洲行动》中的一个赛季任务
yaml

2. 在正文中用 <span class="tooltip"> 包裹需要标注的词汇：

<span class="tooltip">归零之日</span>终于做完了...
html

多行标注#

对于需要换行显示的长内容，使用 YAML 的 | 语法：

tooltips:
  归零之日: |
    任务类型: 命运契约
    任务名称: 归零之日
    · 在零号大坝击败5名阿萨拉盾兵
    · 在零号大坝击败3名阿萨拉机枪兵
    · 在航天基地击败5名哈夫克盾兵
yaml

注意：使用 | 后，内容需要额外缩进（比键名多缩进2个空格）。

效果预览#

标注的词汇会显示为：

  • 主题色 + 下划虚线样式
  • 鼠标悬停时在上方显示带箭头的提示框
  • 多行内容会保留换行格式

图片处理#

日记中的图片可以通过两种方式添加：

方式一：Frontmatter 图片数组#

images:
  - https://example.com/image1.jpg
  - /local/path/image2.png
yaml

方式二：正文中使用 Markdown#

![图片描述](/path/to/image.jpg)
markdown

提示：图片会自动应用 Medium Zoom 效果，点击可放大查看。

最佳实践#

  1. 文件命名：使用 YYYYMMDDD01.md 格式，如 20260209D01.md
  2. 标注适度：避免过多标注影响阅读体验
  3. 简洁内容：tooltip 内容尽量简洁，长内容考虑分行
  4. 图片压缩：上传前压缩图片以提升加载速度