# Markdown扩展语法
# 概述
John Gruber的原始设计文档中概述的基础语法每天增加许多必需的元素,但是对于某些人来说还不够。这就是有了扩展语法的用武之地。
一些个人和组织开始通过添加其他元素(如表,代码块,语法突出显示,URL自动链接和脚注)来扩展基础语法。可以通过使用基于基础Markdown语法的轻量级标记语言,或通过向兼容的Markdown处理器添加扩展来启用这些元素。
# 可用性
并非所有Markdown应用程序都支持扩展语法元素。需要检查您的应用程序使用的轻量级标记语言是否支持要使用的扩展语法元素。如果没有,仍然可以在Markdown处理器中启用扩展。
# 轻量级标记语言
有几种轻量级标记语言是Markdown的超集。它们包括Gruber的基本语法,并通过添加其他元素(例如表,代码块,语法突出显示,URL自动链接和脚注)在此基础上构建。许多最受欢迎的Markdown应用程序使用以下轻量级标记语言之一:
- CommonMark (opens new window)
- GitHub Flavored Markdown (GFM) (opens new window)
- Markdown Extra (opens new window)
- MultiMarkdown (opens new window)
- R Markdown (opens new window)
# Markdown 处理器
Markdown有数十种处理器 (opens new window)。它们中的许多允许添加启用扩展语法元素的扩展。查看处理器的文档以获取更多信息。
# 表格
要添加表格,请使用三个或多个连字符(---)创建各列的标题,并使用竖线(|)分隔各列。可以选择在表的任一端添加竖线。
|语法 |描述 |
|---------|-----|
|Header |标题 |
|Paragraph|段落 |
2
3
4
输出结果为:
语法 | 描述 |
---|---|
Header | 标题 |
Paragraph | 段落 |
单元格宽度可以变化,如下所示。输出结果会看起来相同。
|语法|描述|
|----|----|
|Header|标题|
|Paragraph|段落|
2
3
4
TIP
用连字符和竖线创建表可能很乏味。为了加快该过程,请尝试使用Markdown Tables Generator (opens new window)。使用图形界面构建表,然后将生成的Markdown格式的文本复制到文件中。
# 对齐
通过在标题行内的连字符的左侧,右侧或两侧添加冒号(:
),可以将列中的文本左,右或居中对齐。
| 语法 | 描述 | 测试内容 |
| :--- | :----: | ---:|
| Header | 标题 | 此处 |
| Paragraph | 段落 | 更多 |
2
3
4
输出结果为:
语法 | 描述 | 测试内容 |
---|---|---|
Header | 标题 | 此处 |
Paragraph | 段落 | 更多 |
# 格式化表格中的文字
可以格式化表格中的文字。例如,添加链接,代码(仅反引号(`)中的文本,而不是代码块)和强调。
无法添加标题,块引用,列表,水平线,图像或HTML标签。
# 在表中转义竖线字符
可以通过HTML字符代码(|
)来显示竖线(|)符号。
# 代码区块
Markdown基本语法允许通过将行缩进四个空格或一个制表符来创建代码区块。如果发现不方便,请尝试使用受保护的代码块。根据Markdown处理器或编辑器的不同,您将在代码块之前和之后的行上使用三个反引号(`)或三个波浪号(~~~)。最大的好处是,您不必缩进任何一行!
~~~
{
"firstName": "John",
"lastName": "Smith",
"age": 25
}
~~~
2
3
4
5
6
7
输出结果为:
{
"firstName": "John",
"lastName": "Smith",
"age": 25
}
2
3
4
5
TIP
是否需要在代码块中显示反引号?请参阅本节以了解如何逃避它们。
# 语法高亮
许多Markdown处理器都支持受保护代码块的语法突出显示。此功能使您可以为编写代码的任何语言添加颜色突出显示。要添加语法突出显示,请在受防护的代码块之前的反引号旁边指定一种语言。
~~~json
{
"firstName": "John",
"lastName": "Smith",
"age": 25
}
~~~
2
3
4
5
6
7
输出结果为:
{
"firstName": "John",
"lastName": "Smith",
"age": 25
}
2
3
4
5
# 脚注
脚注使您可以添加注释和参考,而不会使文档正文混乱。创建脚注时,带有脚注引用的链接会显示上标编号。读者可以单击该链接以跳至页面底部的脚注内容。
要创建脚注参考,请在方括号([^ 1])内添加插入符号和标识符。标识符可以是数字或文字,但不能包含空格或制表符。标识符仅将脚注参考与脚注本身相关联-在输出中,脚注按顺序编号。
在脚括号内使用另一个插入符号和数字添加脚注,并带有冒号和文本([^ 1]:我的脚注。)。您不必在文档末尾添加脚注。您可以将它们放在除列表,块引号和表格之类的其他元素之外的任何位置。
这是一个短脚注,[^1] 这是一个很长的。[^长脚注]
[^1]: 这是第一个脚注。
[^长脚注]: 这是一个有段落和代码的脚注。
在脚注中包含段落。
`{ my code }`
如果喜欢,可以添加更多段落。
2
3
4
5
6
7
8
9
10
11
输出结果为:
在脚注中包含段落。
`{ my code }`
如果喜欢,可以添加更多段落。
# 标题ID
许多Markdown处理器支持标题的自定义ID-一些Markdown处理器会自动添加它们。添加自定义ID允许直接链接到标题并使用CSS对其进行修改。要添加自定义标题ID,请在与标题相同的行上用大括号括起该自定义ID。
### 大标题 {#custom-id}
对应的HTML为:
<h3 id="custom-id">大标题</h3>
# 链接到标题ID
通过创建带有符号(#)和自定义标题ID的标准链接,可以链接到文件中具有自定义ID的标题。
Markdown | HTML | 输出结果 |
---|---|---|
[标题 ID](#heading-id) | 标题 ID | 标题 ID |
通过将自定义标题ID添加到网页的完整URL,其他网站可以链接到标题(例如[标题ID](https://www.markdownguide.org/extended-syntax#heading-ids)
)。
# 定义列表 definition lists
某些Markdown处理器允许创建项目名称及其对应定义的定义列表。要创建定义列表,请在第一行上键入项目名称。在下一行,键入一个冒号,后跟一个空格和定义。
第一项
: 这是第一项的定义
第二项
: 这是第二项的一条定义
: 这是另一条定义
2
3
4
5
6
对应的HTML为:
<dl>
<dt>第一项</dt>
<dd>这是第一项的定义</dd>
<dt>第二项</dt>
<dd>这是第二项的一条定义 </dd>
<dd>这是另一条定义</dd>
</dl>
2
3
4
5
6
7
输出的结果为:
第一项 : 这是第一项的定义
第二项 : 这是第二项的一条定义 : 这是另一条定义
# 删除线
您可以通过在文本中心放置一条水平线来删除文本。结果看起来像这样。此功能使您可以指示某些文本是一个错误,并不意味着要包含在文档中。若要删除文本,请在文本前后使用两个波浪号(~~)。
~~地球是平的~~。事实上地球是圆的。
输出结果为:
地球是平的。事实上地球是圆的。
# 任务列表
任务列表可以创建带有复选框的项目列表。在支持任务列表的Markdown应用程序中,复选框将显示在内容旁边。要创建任务列表,请在任务列表项之前添加中划线(-)和中括号([]),并在其之间添加空格。要选择一个复选框,请在方括号([x])之间添加一个x。
- [x] 录制视频教程
- [ ] 更新网站课程清单
- [ ] 发布课程更新通知
# Emoji
将表情符号添加到Markdown文件的方法有两种:将表情符号复制并粘贴到Markdown格式的文本中,或键入表情符号短代码。
# 复制和粘贴表情符号
在大多数情况下,可以简单地从Emojipedia (opens new window)等来源复制表情符号并将其粘贴到文档中。许多Markdown应用程序将以Markdown格式的文本自动显示表情符号。从Markdown应用程序导出的HTML和PDF文件应显示表情符号。
TIP
如果您使用的是静态网站生成器,请确保将HTML页面编码为UTF-8 (opens new window)。
# 使用表情符号简码
一些Markdown应用程序允许通过输入表情符号短代码来插入表情符号。它们以冒号开头和结尾,并包含表情符号的名称。
你妈妈喊你回家吃饭 :tent:
这太有意思了 :joy:
2
3
输出结果为:
你妈妈喊你回家吃饭 ⛺️
这太有意思了 😂
TIP
可以使用此表情符号简码列表 (opens new window),但请记住,表情符号简码因应用程序而异。有关更多信息,请参阅Markdown应用程序的文档。
# 自动URL链接
许多Markdown处理器会自动将URL转换为链接。这意味着如果您输入http://www.example.com,即使您没有使用方括号,Markdown处理器也会自动将其转换为链接。
https://zjbcool.com
输出结果为:
https://zjbcool.com (opens new window)
# 禁用自动URL链接
如果不希望自动链接网址,则可以通过将网址表示为带反引号的代码来删除该链接。
`https://zjbcool.com`
输出结果为:
https://zjbcool.com
← Markdown基础语法 前端笔记 →