博客功能全测试

Sun, 19 Jul 2026 20:00:00 +0800

基础排版

文字样式

这是一段普通文字。这是粗体，这是斜体，~~这是删除线~~，这是行内代码。

还可以使用 粗斜体 来同时强调。

无序列表

第一项
第二项
- 子项目 A
- 子项目 B
第三项

有序列表

安装 Hugo
创建站点
选择主题
开始写作

任务列表

搭建博客框架
配置主题
添加自定义功能
持续更新文章

引用

代码是写给人看的，附带能在机器上运行。

— Harold Abelson

嵌套引用：

第一层引用

第二层嵌套引用

第三层，兔子洞到底有多深？

分割线

代码高亮

普通代码块

def fibonacci(n: int) -> list[int]:
    """生成斐波那契数列"""
    fib = [0, 1]
    for i in range(2, n):
        fib.append(fib[i-1] + fib[i-2])
    return fib[:n]

print(fibonacci(10))

带文件名的代码块

    📄 app.js
  
const express = require("express");
const app = express();

app.get("/", (req, res) => {
  res.json({ message: "Hello, Hugo Blog!" });
});

app.listen(3000, () => {
  console.log("Server running on port 3000");
});

    📄 index.html
  

<html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <title>我的博客title>
  head>
  <body>
    <h1>Hello Worldh1>
  body>
html>

    📄 deploy.sh
  
#!/bin/bash
hugo --minify
git add -A
git commit -m "deploy: $(date '+%Y-%m-%d %H:%M')"
git push origin master

多语言测试

package main

import "fmt"

func main() {
    fmt.Println("Hello, 世界!")
}

:root {
  --primary: #2563eb;
  --radius: 8px;
}

.card {
  border-radius: var(--radius);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

SELECT p.title, p.date, COUNT(c.id) AS comment_count
FROM posts p
LEFT JOIN comments c ON p.id = c.post_id
WHERE p.date >= '2026-01-01'
GROUP BY p.id
ORDER BY comment_count DESC
LIMIT 10;

数学公式（KaTeX）

行内公式

质能方程 $E = mc^2$，欧拉公式 $e^{i\pi} + 1 = 0$，勾股定理 $a^2 + b^2 = c^2$。

块级公式

二次方程求根公式：

$$ x = \frac{-b \pm \sqrt{b^2 - 4ac}}{2a} $$

高斯积分：

$$ \int_{-\infty}^{\infty} e^{-x^2} dx = \sqrt{\pi} $$

矩阵：

$$ \begin{pmatrix} a_{11} & a_{12} \ a_{21} & a_{22} \end{pmatrix} \begin{pmatrix} x_1 \ x_2 \end{pmatrix} = \begin{pmatrix} b_1 \ b_2 \end{pmatrix} $$

求和与连乘：

$$ \sum_{k=1}^{n} k = \frac{n(n+1)}{2}, \quad \prod_{k=1}^{n} k = n! $$

表格

基础表格

功能	状态	说明
Markdown 渲染	✅	支持 GFM 扩展语法
代码高亮	✅	Chroma 引擎，Monokai 主题
数学公式	✅	KaTeX 渲染
Mermaid 图表	✅	流程图/时序图/甘特图
图片灯箱	✅	GLightbox 点击放大
加密内容	✅	SHA-256 前端验证

对齐方式

左对齐	居中对齐	右对齐
Hugo	静态生成器	Go
Vite	构建工具	JavaScript
Tailwind	CSS 框架	Utility-first

提示框（Alert）

💡 提示

这是一条信息提示，用于展示补充说明或小贴士。

✅ 成功

操作已成功完成！你的博客已部署上线。

⚠️ 注意

修改 hugo.toml 后需要重启服务才能生效。

🚫 危险

请勿在生产环境使用 --disableLiveReload 以外的调试参数！

折叠面板（Details）

点击展开：什么是 Hugo？

测试 on 我的博客