Markdown 演示
这是一篇真正的 .md 文档。打开 src/content/docs/examples/markdown.md,可以把源文件中的语法与当前页面逐项对照。
想查看组件、选项卡与表达式,请阅读 MDX 演示。
1. 页面信息与标题
Section titled “1. 页面信息与标题”源文件开头的 frontmatter 用来设置页面标题、摘要与导航顺序:
---title: Markdown 演示description: 用一句话介绍这篇文章。sidebar: order: 1---页面主标题来自 title,正文可以从 ## 开始。右侧文章目录会帮助读者定位章节。
这是三级标题
Section titled “这是三级标题”适合在一个章节内进一步拆分主题。
2. 文字强调
Section titled “2. 文字强调”普通文字、粗体重点、斜体强调、已经调整的计划,以及行内代码 npm run dev 可以混合使用。
对应写法:
普通文字、**粗体重点**、*斜体强调*、~~已经调整的计划~~,以及行内代码 `npm run dev`。3. 列表与任务清单
Section titled “3. 列表与任务清单”- 德语学习:记录例句与复习问题。
- 吉他学习:保存练习片段与录音复盘。
- PCB Layout 设计:整理约束与设计决策。
- 明确这次记录的主题。
- 保存过程与结果。
- 写下下一步行动。
- 创建一篇 Markdown 文章。
- 检查标题、代码块与表格。
- 换成自己的学习记录。
任务清单用于展示完成状态;修改源文件中的 [ ] 与 [x] 即可更新。
- [x] 已完成- [ ] 待完成4. 用表格整理内容
Section titled “4. 用表格整理内容”| 栏目 | 本次记录 | 下一步 |
|---|---|---|
| 德语学习 | 整理一句新的表达 | 写出自己的例句 |
| 吉他学习 | 记录一个练习片段 | 回听并标注问题 |
| PCB Layout 设计 | 保存一项设计约束 | 补充来源与版本 |
| 栏目 | 本次记录 | 下一步 || --- | --- | --- || 德语学习 | 整理一句新的表达 | 写出自己的例句 |5. 代码块
Section titled “5. 代码块”在代码围栏后写上语言名称,页面会显示对应的语法高亮。下面是启动项目的 PowerShell 命令:
cd F:\docnpm run dev也可以展示 JavaScript:
const topics = ['德语学习', '吉他学习', 'PCB Layout 设计'];
for (const topic of topics) { console.log(`今天整理:${topic}`);}这里的代码块只展示代码,不会在页面中执行。
6. 链接与图片
Section titled “6. 链接与图片”[使用指南](/guides/getting-started/)下面复用项目已有的示例图片,演示图片路径与替代文本:

图片路径相对于当前 .md 文件;方括号中的文字用于描述图片内容。
7. 引用与提示框
Section titled “7. 引用与提示框”每次记录一个具体问题,并留下可以继续行动的线索。
普通引用使用 >:
> 每次记录一个具体问题,并留下可以继续行动的线索。Starlight 还支持以下提示框写法:
:::note[记录提示]这里填写提示内容。:::8. 一篇笔记的最小模板
Section titled “8. 一篇笔记的最小模板”复制下面的模板,在对应栏目中创建新文件即可:
---title: 我的学习记录description: 说明这次记录的主题。---
## 目标
这次要解决什么问题?
## 过程
做了什么,参考了什么材料?
## 结果
观察到了什么,还存在哪些疑问?
## 下一步
- [ ] 一个具体的行动接下来可以阅读 MDX 演示,看看如何在文章中加入组件。