主题样式参考

标题层级

三级标题 H3

四级标题 H4

五级标题 H5

六级标题 H6

注意：H1 为文章标题，由模板渲染不出现在正文中；H2 为正文最高层级章节标题（带主题色）。

文本样式

普通正文段落。本站正文使用 Clear Han Serif（屏显臻宋）渲染，行高 1.85，基准字号 18px。中长文阅读舒适度是排版的核心考量，这个段落就是最常用的正文样式。

这是另一个段落，用来展示段落间距。段落之间应有 1.35em 的上下间距，视觉上清晰分隔但不至于松散。中英文混排的情况：Hugo 是一个 static site generator，支持 Goldmark 作为默认的 Markdown 渲染引擎。

粗体文字 用于强调。斜体文字 用于次要标注。粗斜体。~~删除线~~。行内代码 用于提及函数名、变量或命令。

上标示例：E=mc²，下标示例：H₂O。

键盘标记：按下 Ctrl + C 复制，Ctrl + V 粘贴。

链接

回到首页 — 站内链接。

Giscus — 外部链接。链接下划线颜色使用 --link-underline，粗细 1.5px，悬停时变为强调色。

引用

这是单层引用块。左侧有 2px 宽的强调色竖线，文字 muted 灰色，斜体。
— 某处

多层嵌套引用：
第二层。
第三层。嵌套加深时左侧边框和缩进应当清晰可辨。

引用块内也可包含列表和代码：

第一项
第二项
echo "hello from blockquote"

列表

无序列表

第一项：普通列表项
第二项：包含多个子项
- 子项一
- 子项二
  - 孙子项
第三项：包含加粗文字的列表项

有序列表

第一步：打开编辑器
第二步：编写 Markdown
第三步：构建站点
1. 检查语法错误
2. 预览效果
3. 部署上线
第四步：完成

混合列表

事项一：描述文本
1. 子步骤
2. 子步骤
事项二
- 子事项

定义列表

Hugo: 一个用 Go 语言编写的静态站点生成器，以构建速度快著称。
Markdown: 一种轻量级标记语言。
静态站点: 由预先生成的 HTML、CSS 和 JavaScript 文件组成的网站。

代码

行内代码

使用 hugo server 启动本地开发服务器。配置文件 config.toml 位于项目根目录。

代码块（语法高亮）

def quicksort(arr):
    if len(arr) <= 1:
        return arr
    pivot = arr[len(arr) // 2]
    left = [x for x in arr if x < pivot]
    middle = [x for x in arr if x == pivot]
    right = [x for x in arr if x > pivot]
    return quicksort(left) + middle + quicksort(right)

print(quicksort([3, 6, 8, 10, 1, 2, 1]))

function fibonacci(n) {
  if (n <= 1) return n;
  const fib = [0, 1];
  for (let i = 2; i <= n; i++) {
    fib[i] = fib[i - 1] + fib[i - 2];
  }
  return fib[n];
}

console.log(fibonacci(10)); // 55

package main

import "fmt"

func main() {
    for i := 1; i <= 10; i++ {
        if i%3 == 0 && i%5 == 0 {
            fmt.Println("FizzBuzz")
        } else if i%3 == 0 {
            fmt.Println("Fizz")
        } else if i%5 == 0 {
            fmt.Println("Buzz")
        } else {
            fmt.Println(i)
        }
    }
}

/* CSS 示例 */
.post-content code {
  font-family: var(--mono);
  font-size: 0.82em;
  padding: 0.12em 0.32em;
  border-radius: 4px;
  background: var(--code);
}

$ hugo new post/my-new-post.md
$ hugo server --bind 0.0.0.0 --noHTTPCache

{
  "title": "Moments Between",
  "theme": "moments",
  "features": ["archive", "tags", "giscus", "dark-mode"]
}

<article class="post">
  <h1>文章标题</h1>
  <p>这是一段正文。</p>
</article>

纯代码块（无高亮）

Hello, world!
这是一个没有指定语言的代码块。
只有基本的等宽字体和边框。

列表内嵌代码块

步骤一：安装依赖
```
npm install hugo
```
步骤二：启动服务
```
hugo server
```
步骤三：打开浏览器访问 http://localhost:1313

水平分割线

居中的窄分割线，宽度 96px，表示章节之间的停顿。

表格

序号	名称	描述	数量
1	苹果	红富士	3 斤
2	香蕉	海南香蕉	5 斤
3	橘子	砂糖橘	2 斤
4	葡萄	巨峰葡萄	1 串
5	西瓜	麒麟瓜	1 个

表格带边框、表头强调色背景、交替行背景色。

对齐测试

左对齐	居中对齐	右对齐
左	中	右
单元格较长内容	单元格	单元格

图片

图片默认最大宽度 100%，带 1px 边框，点击可放大查看（lightbox）。Figcaption 以斜体显示，前置 ※ 装饰符。

脚注

这是一段需要注释的文字¹，后面还有更多内容²。

折叠面板

点击展开查看更多

这是折叠区域内的内容。可包含任意 Markdown 格式：

列表项一
列表项二

引用块也可以放在这里。

任务列表

已完成任务
待办任务
另一个待办

前后篇导航

文章底部有"上一篇/下一篇"链接，使用两列网格布局，标题上方有"上一篇"/“下一篇"的中文提示。

底部有"随便看看"区域，展示 3 篇相关文章（基于标签关联度，不足时随机补齐），采用与文章列表相同的日期+标题网格布局。

EOF — 以上覆盖了本站主题在正文部分的所有 Markdown 渲染样式。

这是第一条脚注的解释内容。 ↩︎
这是第二条脚注，可以包含富文本和代码。 ↩︎