3. 高级语法

有些时候基础语法不足以满足复杂一些的排版需求,这时候就需要使用扩展语法了。本文主要介绍 Markdown 的扩展语法。

基础语法 中我们介绍了 Markdown 最常用的排版用法,但有些时候基础语法不足以满足复杂一些的排版需求,这时候就需要使用扩展语法了。比如引入表格、围栏代码块、代码高亮、自动链接、脚注和目录等。

一、表格

使用短横线 --- 来分隔表头和表身,使用竖线 | 来分隔列,每行开头和结尾的竖线是可选的。

| Syntax      | Description |
| ----------- | ----------- |
| Header      | Title       |
| Paragraph   | Text        |

结果:

Syntax Description
Header Title
Paragraph Text
:---------- :-----------:
Header Title
Paragraph Text

每个列可以不用对齐,同样能够渲染。

表格对齐

如果需要左对齐、居中对齐或者右对齐表格内容,可以通过在 --- 中添加冒号 : 实现。冒号仅出现在左边表示左对齐,出现在两边表示居中对齐,仅出现在右边表示右对齐。

| Syntax      | Description | Test Text     |
| :---        |    :----:   |          ---: |
| Header      | Title       | Here's this   |
| Paragraph   | Text        | And more      |

结果:

| Syntax | Description | Test Text |

Syntax Description
Header Title
Paragraph Text
:---------- :-----------:
Header Title
Paragraph Text

表格中的内容也可以进行排版,比如加粗、强调文本,插入超链接等。但仅限于使用“行级元素”进行排版,不能使用“块级元素”,比如不能使用标题、块引用、列表、分隔线等。

如果需要在表格内容中使用竖线 |,那就需要对其进行转义。可以使用 \| 转义,但更稳妥的做法是写竖线的 HTML 实体表示 |,因为有的 Markdown 引擎不能正确处理表格内容中的 \|

二、标题指定 ID {#heading-ids}

一些 Markdown 引擎支持为标题指定 ID,另一些 Markdown 引擎是自动添加 ID 的。标题 ID 的作用是允许其他地方通过锚点直接跳转到该标题。标题指定 ID 的语法是在标题后面通过花括号包裹 ID。

### 这是一个标题 {#custom-id}

渲染的 HTML:

<h3 id="custom-id">这是一个标题</h3>

可以通过超链接语法链接到文中的标题。

Markdown HTML 渲染结果
[标题指定 ID](#heading-ids) <a href="#heading-ids">标题指定 ID</a> 标题指定 ID

如果需要链接到其他页面的标题,需要写全链接路径,比如 `[标题指定 ID]

(http://www.jiangguo.net/c/vY/kz.html#heading-ids)

三、删除线

可以通过删除线划掉文本,排版结果~就像这样~。创建删除线可以通过一个 ~ 或两个波浪线 ~~ 包裹待删除的文本。

~~这行文字不要了。~~ 这行文字要。

结果:

这行文字不要了。 这行文字要。

四、任务列表

通过在普通列表项中添加 [ ] 或者 [x] 来渲染任务列表项。

- [x] 待办事项一
- [ ] 待办事项二
- [ ] 待办事项三

结果:

  • 待办事项一
  • 待办事项二
  • 待办事项三

五、Emoji 表情

有两种方法使用 Emoji 表情:直接输入 Emoji 字符或者使用别名 :smile:。直接输入的话需要确认当前编辑器使用 UTF-8 编码。

匠果是一个阳光少年 :sunny:
工匠精神 🌻 激励着我们

匠果是一个阳光少年 :sunny:

工匠精神 🌻 激励着我们

六、禁止自动链接

大部分 Markdown 引擎都是默认开启自动链接的,所以当我们想把一个链接渲染为纯文本时,需要把它变成代码:

`http://www.jiangguo.net`

结果:

http://www.jiangguo.net

七、超链接

通过 [链接文本](URL) 来创建超链接。

[匠果](http://www.jiangguo.net)

结果:

匠果

添加超链接标题

链接标题是可选的,在圆括号中的 URL 后空格并用双引号包裹。

[匠果](http://www.jiangguo.net "匠果-工匠之果")

结果:

匠果

URL 和邮件地址

如果要直接显示 URL 或者邮件地址,可以通过 `` 来包裹 URL 或者邮件地址。

<http://www.jiangguo.net>
<guo@jiangguo.net>

结果:

http://www.jiangguo.net

guo@jiangguo.net

超链接格式排版

超链接可以和加粗强调、代码等元素结构一同使用。

为自己写一本书 **[匠果](http://www.jiangguo.net)**。
为自己写一本书 [`匠果`](http://www.jiangguo.net)。

结果:

为自己写一本书 匠果

为自己写一本书 匠果

八、图片

使用感叹号 ! 后跟超链接就可以渲染图片了。

![匠果Logo](http://www.jiangguo.net/img/jg-logo.png)

结果:

匠果Logo

超链接嵌套图片

如果需要点击图片可以跳转页面,只需要在链接文本部分包含图片即可。

[![匠果](http://www.jiangguo.net/img/jg-logo.png)](http://www.jiangguo.net)

结果:

匠果

下一节:编辑器的快捷键速查