Tag Plugin Plus 外挂标签全览

---

时间轴

时间轴

2026-07-11

init

本文介绍了Tag Plugin Plus外挂标签的全面功能，通过系统测试当前主题对标准Markdown及扩展语法的渲染支持情况。文章涵盖了标题层级、行内格式（粗体、斜体、删除线、高亮、上下标）、链接、图片、列表（无序、有序、任务列表）、引用、代码块、表格（包括单元格合并）、分割线、脚注、Emoji、转义字符、数学公式（KaTeX）以及Mermaid图表等丰富内容。重点展示了表格的水平和垂直合并、组合合并及边界情况，并验证了数学公式和Mermaid图表的实际渲染效果，帮助用户全面了解该主题对Markdown语法的支持程度。

---

Markdown 基础语法

以下测试当前主题对标准 Markdown 及扩展语法的渲染支持情况。

---

标题层级

h1 一级标题

h2 二级标题

h3 三级标题

h4 四级标题

h5 五级标题

h6 六级标题

---

行内格式

粗体文本、斜体文本、粗斜体文本、删除线文本、行内代码

高亮文本（若支持）、上标 X²、下标 H₂O（若渲染器支持）

高亮 (mark) 边界

连续高亮：第一段 与 第二段 之间夹杂普通文字。

高亮内嵌格式：粗体 +代码+ 删除 混合行内语法。

引用块内的 高亮文字。

场景	示例
表格内高亮	单元格高亮
高亮含链接	even629

---

链接

普通链接

外部链接

带标题的链接

even629’s blog

参考式链接

Hexo 官网 和 Cactus 主题

自动链接

https://even629.com

---

图片

Linux

---

列表

无序列表

• 一级列表项 A
• 一级列表项 B
  • 二级嵌套项 B1
  • 二级嵌套项 B2
    • 三级嵌套项
• 一级列表项 C

有序列表

1. 第一步
2. 第二步
   1. 第二步的子步骤 A
   2. 第二步的子步骤 B
3. 第三步

任务列表

• 已完成任务
• 未完成任务
• 待办事项
  • 嵌套任务项

任务列表边界

• 阅读 Hexo 文档 并 记录笔记
• 运行hexo s本地预览
• 提交 草稿 正式版
• 普通列表项（与任务项混排）
  • 嵌套任务，含行内代码
  • 嵌套任务已完成

---

引用

单层引用

这是一段引用文字。可以跨越多行。

嵌套引用

第一层引用

第二层引用

第三层引用

引用内嵌其他元素

引用内的标题

• 列表项 1
• 列表项 2

console.log("hello")

继续嵌套

---

代码

行内代码

在文本中使用print()函数来输出内容。

围栏代码块

#include <stdio.h>

int main() {
    printf("Hello, World!\n");
    return 0;
}

代码块指定语言

def fibonacci(n):
    a, b = 0, 1
    for _ in range(n):
        yield a
        a, b = b, a + b

print(list(fibonacci(10)))

fn main() {
    let msg = "Hello, 世界!";
    println!("{}", msg);
}

代码块内的转义

<div class="container">
  <p>Hello &amp; welcome</p>
</div>

---

表格

基本表格

列 A	列 B	列 C
值 1	值 2	值 3
值 4	值 5	值 6

对齐表格

左对齐	居中对齐	右对齐
左	中	右
单元格	单元格	单元格

表格内嵌行内格式

名称	说明
粗体	粗体文本
代码	行内代码
链接	点我
混合	粗体 +代码+ 删除

单元格合并 (merge cells)

通过markdown-it-merge-cells-plus插件按需合并单元格：在单元格中填入标记符即触发合并，默认不合并相邻的相同单元格。

• <- 将当前单元格合并到左侧单元格（水平 /colspan）
• ^- 将当前单元格合并到上方单元格（垂直 /rowspan）

表头行只能用<左右合并，不能上下合并；^仅从第二行正文起生效（第一行正文紧贴表头，不能并入表头）。合并区域必须构成矩形。

水平合并 (colspan)

表头与正文均使用<向左合并：

类别	前端技术栈
全栈
后端	Node	Go

表头前端技术栈合并右侧一格（colspan=2）；正文全栈跨越三列。

垂直合并 (rowspan)

正文使用^向上合并：

类别	项目	说明
前端	HTML	标记语言
	CSS	样式语言
	JS	脚本语言
后端	Node	运行时

前端借助两个^向下合并，跨越三行（rowspan=3）。

组合合并 (colspan + rowspan)

<与^可在同一表格混用，构成跨行跨列的合并块：

Region		Q1
North		100
		200
South		300

表头Region跨两列；正文North同时跨两行两列（rowspan=2 colspan=2），其下方仅保留200。

边界情况 (无效标记原样显示)

以下场景标记不触发合并，按字面量</^渲染：

^	表头中的 ^ 原样显示
^	首行正文的 ^ 原样显示
<	首列的 < 原样显示
数据	正常单元格

表头中的^、首行正文中的^、首列中的<均为 no-op，原样显示为字面文本。

---

分割线

---

---

---

---

脚注

这是一段有脚注的文字^[1]，这里还有另一个脚注^[2]。

---

Emoji

😆 🚀 ❤️ 👍 💯 🔥 💪 👏

---

转义字符

*不会变成斜体* `不会变成代码` ~不会变成删除线~

---

数学公式 (KaTeX)

行内公式

质能方程：$E = mc^2$

欧拉公式：$e^{i\pi} + 1 = 0$

块级公式

$$\sum_{i=1}^{n} x_i = x_1 + x_2 + \cdots + x_n$$

$$\int_{a}^{b} f(x)\,dx = F(b) - F(a)$$

$$\begin{bmatrix} 1 & 2 & 3 \\ 4 & 5 & 6 \\ 7 & 8 & 9 \end{bmatrix}$$

---

Mermaid 图表

以下测试 Mermaid 流程图渲染（本文 frontmatter 已设mermaid: true，启用 mermaid 库）。

流程图 (flowchart)

graph TD A[开始] --> B{是否登录?} B -- 是 --> C[进入主页] B -- 否 --> D[跳转登录] D --> E[输入凭证] E -->|成功| C E -->|失败| D C --> F[结束]

时序图 (sequenceDiagram)

sequenceDiagram participant U as 用户 participant S as 服务器 participant D as 数据库 U->>S: 发起请求 S->>D: 查询数据 D-->>S: 返回结果 S-->>U: 响应数据 Note over U,D: 一次完整的请求-响应流程

甘特图 (gantt)

gantt title 项目开发计划 dateFormat YYYY-MM-DD section 设计 需求分析 :done, des1, 2026-07-01, 7d 原型设计 :done, des2, after des1, 5d section 开发 前端开发 :active, dev1, after des2, 10d 后端开发 : dev2, after des2, 12d section 测试 集成测试 : tst1, after dev1, 5d 上线部署 : tst2, after tst1, 2d

饼图 (pie)

pie title 博客文章分类占比 "Linux 内核/驱动" : 35 "ARM 架构" : 20 "QEMU 虚拟化" : 15 "编程语言" : 20 "其他" : 10

类图 (classDiagram)

classDiagram class Animal { +String name +int age +makeSound() void } class Dog { +fetch() void } class Cat { +purr() void } Animal <|-- Dog Animal <|-- Cat

状态图 (stateDiagram-v2)

stateDiagram-v2 [*] --> 草稿 草稿 --> 审核中: 提交 审核中 --> 已发布: 通过 审核中 --> 草稿: 驳回 已发布 --> [*] 草稿 --> [*]: 删除

带样式节点

graph LR A[普通节点] --> B(圆角节点) B --> C{决策节点} C -->|是| D[/平行四边形/] C -->|否| E[(数据库)] style A fill:#f9f,stroke:#333,stroke-width:2px style D fill:#9f9,stroke:#333 style E fill:#69f,stroke:#333,color:#fff

语法：使用```mermaid围栏代码块。支持 flowchart / sequence / gantt / pie / class / state 等图表类型，详见 Mermaid 文档。需在 frontmatter 设置mermaid: true才会加载 mermaid 库并渲染。

---

---

Tag Plugin Plus 外挂标签

以下展示所有从 Butterfly 移植到 Cactus 的外挂标签及其变体。

---

链接卡片 (link)

带图片的链接

even629's blog

https://even629.com

不带图片的链接

Hexo官网

https://hexo.io

语法：{% link 标题, 链接, 图片URL(可选) %}

---

链接卡片

Hexo

https://hexo.io

Cactus

https://github.com/probberechts/hexo-theme-cactus

Font Awesome

https://fontawesome.com

语法：{% link ... %}

---

行内图片 (inlineimage)

在一段文字中 嵌入行内小图标。

自定义高度：

语法：{% inlineimage 图片URL, height=高度(可选) %}

---

行内文本标签

样式一览

标签	效果	说明
u	下划线文字	下划线
emp	着重文字	着重标记
wavy	波浪线文字	波浪下划线
kbd	Ctrl + C	键盘按键
psw	密码文字	密码遮蔽（hover 可见）
del	删除文字	删除线

组合使用

按下 Ctrl + Shift + I 打开开发者工具。

这是一段包含下划线、着重和波浪线的混合文本。

语法：{% 标签名 文字内容 %}— 无结束标签

---

带颜色段落 (p) 与行内 (span)

颜色测试

红色段落文字

蓝色段落文字

绿色段落

黄色段落

青色段落

紫色段落

灰色段落

行内 span

这是一段文字，其中包含红色文字和蓝色文字。

对齐方式

居中段落文字

右对齐段落文字

字号大小

大号字体段落

超大号字体段落

语法：{% p 颜色, 文字 %}/{% span 颜色, 文字 %}— 颜色支持中英文（红/red、蓝/blue 等）

---

提示框 (tip)

基础样式

默认样式的 tip 提示框

info 样式的 tip

success 样式的 tip（成功提示）

warning 样式的 tip（警告提示）

danger 样式的 tip（危险提示）

扩展样式

bolt 样式（闪电图标）

ban 样式（禁止图标）

home 样式（主页图标）

sync 样式（同步图标）

cogs 样式（齿轮图标）

key 样式（钥匙图标）

bell 样式（铃铛图标）

语法：{% tip 样式名 %} 内容 {% endtip %}— 样式：info / success / warning / danger / bolt / ban / home / sync / cogs / key / bell

---

折叠框 (folding)

默认样式

点击展开查看详情

折叠框里的内容，支持 Markdown 语法。

• 列表项
• 行内代码

console.log("折叠框内的代码");

颜色变体

蓝色折叠

蓝色边框的折叠框

红色折叠

printf("红色折叠内的代码块\n");

绿色折叠

绿色折叠框内容

紫色折叠

紫色折叠框内容

青色折叠

青色折叠框内容

黄色折叠

黄色折叠框内容

橙色折叠

橙色折叠框内容

默认展开的折叠框

默认展开的绿色折叠框

这个折叠框默认是展开的（添加open关键字）。

折叠框内嵌表格

折叠框内的表格

名称	值
属性 A	100
属性 B	200

折叠框嵌套

外层折叠

外层内容

内层折叠

内层内容

语法：{% folding [颜色] [open], 标题 %} 内容 {% endfolding %}— 颜色（可选）：blue / red / green / purple / cyan / yellow / orange；添加open关键字可使折叠框默认展开

---

时间线 (timeline)

基本时间线

我的时间线

2024年

开始写博客，搭建 Hexo 站点。

2025年

迁移到 Cactus 主题，优化阅读体验。

2026年

完善外挂标签，增加英文翻译。

带内容的时间线

项目进度

Q1

需求分析与设计

Q2

核心功能开发

Q3

测试与部署上线

语法：{% timeline 标题 %} 内容 {% endtimeline %}- 节点圆圈与竖线统一使用主题色，不再支持自定义颜色

---

标签页 (tabs)

基本标签页

CRustPython

C 是一种通用的过程式编程语言。

printf("hello\n");

Rust 是一种注重安全性的系统编程语言。

println!("hello");

Python 是一种简洁优雅的解释型语言。

print("hello")

指定默认激活标签

标签一标签二标签三（默认激活）

第一个标签的内容

第二个标签的内容

第三个标签的内容，页面加载时自动显示。

带图标的标签页

代码相关内容

设计相关内容

语法：{% tabs 标题, 默认激活序号 %} 内容 {% endtabs %}— 带图标：<!-- tab @fa-icon-class -->

---

多级标签页 (subtabs)

一级 A一级 B

这是第一层 tab A 的内容。

子 1子 2

子标签 1 的内容

子标签 2 的内容

第一层 tab B 的内容。

语法：在tab内部嵌套subtabs/subsubtabs（语法同tabs）

---

注解框 (note)

四种基础风格

flat 风格的 note（默认），适合普通提醒。

modern 风格 note，简洁的纯色背景。

simple 风格 note，左侧带颜色边框。

disabled 风格 note，灰色调。

带标题的 note

注意事项

请在使用前仔细阅读文档。

带图标的 note

提示

带灯泡图标的 note 提醒。

警告

带警告图标的 note。

Note 内嵌 Markdown

支持 粗体、斜体、代码等行内格式。

• 列表项
• 也可以有代码块

const msg = "hello";

标题 + 图标 + 样式组合

modern 现代风格带标题

标题、图标、样式三者同时存在的 modern note。

simple 简洁风格带标题

simple 风格 + 标题 + 灯泡图标。

disabled 已禁用带标题

disabled 风格 + 标题，无图标。

语法：{% note 标题(可选), 图标(可选) %} 内容 {% endnote %}— 风格通过 CSS 类控制

---

进度条 (progress)

基础颜色

90% 已完成

60% 进行中

30% 受阻

扩展颜色

info 进度

primary 进度

blue 进度

gray 进度

边界值

100% 全部完成

0% 尚未开始

语法：{% progress 宽度百分比, 颜色, 标签文字 %}— 颜色：success / warning / danger / info / primary / blue / gray

---

复选框 (checkbox)

默认状态

苹果

香蕉

草莓

选中状态

西瓜

葡萄

颜色变体

红色复选框

绿色复选框

蓝色复选框

黄色复选框

青色复选框

样式变体

加号样式

减号样式

叉号样式

单选框 (radio)

单选选项一

单选选项二

红色单选

颜色与样式叠加

红色加号

绿色减号

黄色叉号

青色单选

蓝色加号

语法：{% checkbox 文字, checked(可选) %}— 颜色/样式放在文字前：red/green/blue/yellow/cyan/plus/minus/times/radio

---

气泡注释 (bubble)

默认颜色

把鼠标移到这个词语 这是注释文字上查看注释。

自定义颜色

另一个词 另一种注释

连续气泡

一句话中可以有多个 第一个注释气泡 第二个注释依次排列。

语法：{% bubble 文字, 注释, 颜色(可选) %}— 无结束标签，hover 显示注释

---

引用标签 (referto + referfrom)

单个引用

正文中引用标注¹Hexo官方文档，点击数字跳转到文末参考文献。

1

Hexo 官方文档

多个引用

这是第2个引用²Cactus 主题 GitHub和第3个引用³Font Awesome 图标库。

第4个引用⁴超级长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长标题测试

2

Cactus 主题 GitHub

3

Font Awesome 图标库

4

超级长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长标题测试

语法：{% referto '编号','文献名' %}文中标注 +{% referfrom '编号','文献名','URL' %}文末列表

鼠标悬停在编号上可预览文献名，点击跳转至文末对应条目。

---

1. 第一个脚注内容。 ↩︎

2. 第二个脚注，可以包含格式和代码。 ↩︎