Markdown 语法指南

gmero · ·
· 指南

本文介绍常用的 Markdown 语法。

标题

使用 # 创建标题,数量代表级别。

文本样式

  • 粗体文本
  • 斜体文本
  • 删除线

链接和图片

独占段落的图片居中显示,正文中的图片保持行内排版。请在独立图片前后留出空行,仅在源码中换行不会创建新段落。

这是一个链接

这是网站图标: 网站图片

本地图片

另一张本地图片

远程图片

错误图片

代码

行内代码:const x = 1;

代码块:

def hello_world():
    print("Hello, World!")
netsh advfirewall firewall add rule name="GameStream UDP" dir=in protocol=udp localport=5353,47998-48010 action=allow
netsh advfirewall firewall add rule name="GameStream TCP" dir=in protocol=tcp localport=47984,47989,48010 action=allow

列表

无序列表:

  • 项目 1
  • 项目 2
  • 项目 3

有序列表:

  1. 第一步
  2. 第二步
  3. 第三步

引用

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

表格

列 1列 2列 3
ABC
DEF

原生 HTML

写文章时,可以用 HTML 补充 Markdown 的表达能力。下面的示例均包含源码和实际效果。Mori 已通过 markup.goldmark.renderer.unsafe = true 启用原生 HTML,请仅使用可信来源的 HTML。在 details 等容器中混写 Markdown 时,需要用空行将 HTML 标签与 Markdown 正文分隔,并让 Markdown 正文顶格书写,避免四空格缩进被识别为代码块。pre、script、style 等原始 HTML 块不适用这种写法。

折叠内容

使用 details 和 summary 放置剧透、答案或补充说明,支持鼠标点击和键盘操作。添加 open 属性即可默认展开。

<details>

<summary>查看答案</summary>

答案是 **42**。

- 在这里放置补充内容。
- 支持 _斜体_ 和 `行内代码` 等 Markdown 语法。

</details>
查看答案

答案是 42。

  • 在这里放置补充内容。
  • 支持 斜体 和 行内代码 等 Markdown 语法。

高亮与新增标记

使用 mark 以主题强调色标记重点,不添加背景色;粗体 **文字** 仅加粗,不改变文字颜色。使用 ins 展示新增的内容。

操作之前,请先<mark>备份文件</mark>。

新增安排:<ins>周六发布更新</ins>。

操作之前,请先备份文件。

新增安排:周六发布更新。

键盘按键与缩写

使用 kbd 表示按键,通过 abbr 的 title 属性说明缩写。重要解释也应写在正文中,不要只依赖悬停提示,因为触屏或键盘操作不一定能访问它。

按 <kbd>Ctrl</kbd> + <kbd>S</kbd> 保存。

<abbr title="HyperText Markup Language">HTML</abbr> 指超文本标记语言。

按 Ctrl + S 保存。

HTML 指超文本标记语言。

上标与下标

使用 sup 和 sub 表示简单公式、单位和化学式。

水:H<sub>2</sub>O。面积:10 m<sup>2</sup>。

水:H2O。面积:10 m2。

定义列表

使用 dl、dt 和 dd 编排术语表或概念解释。

<dl>
  <dt>Markdown</dt>
  <dd>一种用于撰写内容的轻量级标记语言。</dd>
  <dt>HTML</dt>
  <dd>一种赋予内容结构与语义的标记语言。</dd>
</dl>
Markdown
一种用于撰写内容的轻量级标记语言。
HTML
一种赋予内容结构与语义的标记语言。

图片与图注

使用 figure 和 figcaption 将插图与说明关联起来,并为图片提供有意义的 alt 文本。原生 HTML 图片不会经过 Markdown 图片处理,请使用有效的 URL,并按需添加 loading="lazy"。

<figure>
  <img
    src="/favicon.ico"
    alt="Mori 网站图标"
    width="64"
    height="64"
    loading="lazy"
  />
  <figcaption>Mori 网站图标。</figcaption>
</figure>
Mori 网站图标
Mori 网站图标。