这篇是我的 Markdown 速查笔记，忘记语法时直接来这里复制即可。
每节都按「语法」+「预览效果」的形式整理。
1. 标题
# 一级标题
## 二级标题
### 三级标题
预览效果：
一级标题
二级标题
三级标题
2. 段落与换行
普通段落直接写。
如果要强制换行，可以在行尾加两个空格。
这行会换行显示。
3. 强调
**加粗**
*斜体*
~~删除线~~
`行内代码`
效果：加粗、斜体、删除线、行内代码
4. 列表
无序列表
- 苹果
- 香蕉
- 橙子
预览效果：
- 苹果
- 香蕉
- 橙子
有序列表
1. 第一步
2. 第二步
3. 第三步
预览效果：
- 第一步
- 第二步
- 第三步
任务列表
- [x] 已完成
- [ ] 待完成
预览效果：
- 已完成
- 待完成
5. 引用
> 这是一段引用
> 可以写多行
这是一段引用
可以写多行
6. 链接
[Nuxt 官网](https://nuxt.com)
示例：Nuxt 官网
7. 图片（最常用）
本地图片（推荐）
先把图片放到 public/images/blog/，例如：
public/images/blog/my-cover.png
在正文这样写：
预览效果（示例图）：
外链图片
预览效果：外链图依赖第三方地址可访问，建议用上面的本地图方式。
建议优先用本地图片，稳定、可控、不会失效。
8. 代码块
```ts
const count = ref(0)
const doubled = computed(() => count.value * 2)
```
示例：
const count = ref(0)
const doubled = computed(() => count.value * 2)
9. 分割线
---
10. 表格
| 名称 | 说明 | 备注 |
| --- | --- | --- |
| Nuxt | 框架 | SSR/SSG |
| Content | 内容模块 | 写博客很好用 |
| 名称 | 说明 | 备注 |
|---|---|---|
| Nuxt | 框架 | SSR/SSG |
| Content | 内容模块 | 写博客很好用 |
11. 可折叠内容（部分平台支持）
<details>
<summary>点击展开</summary>
这里是折叠内容。
</details>
点击展开
这里是折叠内容。12. 常用 frontmatter 模板
---
title: 文章标题
description: 一句话简介
date: 2026-04-10
tags:
- Nuxt
- 写作
pinned: false
draft: false
---
预览效果：frontmatter 不会显示在正文里，它只用于控制标题、日期、标签、草稿、置顶等元数据。
注意：如果
title中包含冒号（例如box-sizing: border-box）或其他特殊字符，应该用双引号包裹整个标题，否则 YAML 解析可能会出错。例如：
title: "CSS 的 box-sizing: border-box 是什么"
13. 命名建议
- 文件名：
YYYY-MM-DD-your-slug.md - 例如：
2026-04-10-nuxt-content-notes.md - URL 会自动去掉日期前缀，保持简洁
14. 文章样式要求
桌面端布局
- 文章居中 —— 文章内容区域在页面中真正居中，不能偏左
- 目录放右侧 —— TOC 放在文章右边，不是文章内部或下面
- 不能重叠 —— 目录和文章内容不能互相覆盖
- 目录 sticky —— 滚动页面时目录保持固定位置，不跟着走
- "← 全部文章" 对齐 —— 返回链接的左边缘和文章内容的左边缘对齐
- 文章宽度要足够 —— 不能因为放了目录就把文章挤窄
链接样式
- a 链接不要默认蓝色 —— 文章中的链接不显示浏览器默认蓝色
- 点击/访问后也不变色 —— visited 状态颜色也不能变
手机端
- 目录入口改为汉堡按钮 —— 右上角三条横线，点击后弹框式显示目录
- 弹框时锁定页面滚动 —— 目录弹出时外部页面不能滚动，只有目录本身可滚
- 汉堡按钮不超出边界 —— 按钮不能被截断或溢出屏幕
- 没有横向滚动条 —— 任何情况下不出现水平滚动条
评论区