跳转到内容

Markdown 演示

这是一篇真正的 .md 文档。打开 src/content/docs/examples/markdown.md,可以把源文件中的语法与当前页面逐项对照。

想查看组件、选项卡与表达式,请阅读 MDX 演示。

源文件开头的 frontmatter 用来设置页面标题、摘要与导航顺序:

---
title: Markdown 演示
description: 用一句话介绍这篇文章。
sidebar:
order: 1
---

页面主标题来自 title,正文可以从 ## 开始。右侧文章目录会帮助读者定位章节。

适合在一个章节内进一步拆分主题。

普通文字、粗体重点、斜体强调、已经调整的计划,以及行内代码 npm run dev 可以混合使用。

对应写法:

普通文字、**粗体重点**、*斜体强调*、~~已经调整的计划~~,
以及行内代码 `npm run dev`。
  • 德语学习:记录例句与复习问题。
  • 吉他学习:保存练习片段与录音复盘。
  • PCB Layout 设计:整理约束与设计决策。
  1. 明确这次记录的主题。
  2. 保存过程与结果。
  3. 写下下一步行动。
  • 创建一篇 Markdown 文章。
  • 检查标题、代码块与表格。
  • 换成自己的学习记录。

任务清单用于展示完成状态;修改源文件中的 [ ] 与 [x] 即可更新。

- [x] 已完成
- [ ] 待完成
栏目 本次记录 下一步
德语学习 整理一句新的表达 写出自己的例句
吉他学习 记录一个练习片段 回听并标注问题
PCB Layout 设计 保存一项设计约束 补充来源与版本
| 栏目 | 本次记录 | 下一步 |
| --- | --- | --- |
| 德语学习 | 整理一句新的表达 | 写出自己的例句 |

在代码围栏后写上语言名称,页面会显示对应的语法高亮。下面是启动项目的 PowerShell 命令:

终端窗口
cd F:\doc
npm run dev

也可以展示 JavaScript:

const topics = ['德语学习', '吉他学习', 'PCB Layout 设计'];
for (const topic of topics) {
console.log(`今天整理:${topic}`);
}

这里的代码块只展示代码,不会在页面中执行。

站内链接:使用指南、德语学习、返回首页。

[使用指南](/guides/getting-started/)

下面复用项目已有的示例图片,演示图片路径与替代文本:

Starlight 模板中的示例插图

![Starlight 模板中的示例插图](../../../assets/houston.webp)

图片路径相对于当前 .md 文件;方括号中的文字用于描述图片内容。

每次记录一个具体问题,并留下可以继续行动的线索。

普通引用使用 >:

> 每次记录一个具体问题,并留下可以继续行动的线索。

Starlight 还支持以下提示框写法:

:::note[记录提示]
这里填写提示内容。
:::

复制下面的模板,在对应栏目中创建新文件即可:

---
title: 我的学习记录
description: 说明这次记录的主题。
---
## 目标
这次要解决什么问题?
## 过程
做了什么,参考了什么材料?
## 结果
观察到了什么,还存在哪些疑问?
## 下一步
- [ ] 一个具体的行动

接下来可以阅读 MDX 演示,看看如何在文章中加入组件。