markdown入门及语法详细指南★(代码片段)

Markdown 简介

Markdown 是一种轻量级标记语言，于 2004 由约翰·格鲁伯（John Gruber）创建。Markdown 的目标是实现「易读易写」。一份使用 Markdown 格式撰写的文件应该可以直接以纯文本发布，并且看起来不会像是由许多标签或是格式指令所构成。

Markdown 通过少量简单的语法 对文本进行样式化 。大多数情况下，Markdown 只是普通的文本，加上一些非字母字符，比如 # 、* 、- 等。Markdown 语法的种类很少，只对应 HTML 标记的一小部分。Markdown 的理念是，能让文档更容易读、写和随意改。HTML 是一种发布的格式，Markdown 是一种书写的格式。就这样，Markdown 的格式语法只涵盖纯文本可以涵盖的范围。不在 Markdown 涵盖范围之内的标签，都可以直接在文档里面用 HTML 书写。

Markdown不止是HTML的简化版，更重要的是txt的升级版、Word的轻量版，是笔记的最佳载体。作为一种简单的格式标记语言，不同于txt的无格式，不同于HTML的复杂标记，也不同于Word的复杂样式调整。Markdown 通过简单的几个字符键入，就可以快捷的定义文档的样式。掌握 Markdown，你可以享受到简洁之美、享受效率的提升。

使用 Markdown 的优点

• 内容与格式分离，专注你的文字内容而不是排版样式，安心写作。
• 轻松导出 HTML、PDF 等多种格式的文件和本身的 .md 源文件。
• 纯文本内容，兼容所有的文本编辑器与文字处理软件。
• 可读、直观、学习成本低。

Markdown 的应用场景

1. 在线阅览

   • 在线文章（CSDN、博客园等在线平台写作发布的博文资讯，GitBook等发布的系列教程或笔记文档）
   • 帮助文档（README.md，GitHub等项目附带的说明文档，可在线预览及本地阅读）

2. 本地文本编辑

   • 轻量编辑（少量的图文排版和样式调整，简化编辑流程，用于简洁的文档输出。对应的，不适合需要使用到大量内容及繁多样式调整的复杂编辑！此时适宜使用Word等软件进行处理）
   • 方便编辑与分发（基于纯文本内容，不限制平台、编辑器及其版本，同一文件可在任意文本编辑器进行编辑，带来轻便编辑体验。而完成编辑的文件可渲染输出 HTML 页面或者转换为PDF等其他格式，方便在不同平台间共享和阅读）
   • 快速发布（一次编辑、任意导入，对于集成 Markdown 编辑器的任意在线平台，可将源文档直接录入，对内容不作较大改动的情况下进行快速发布，满足文档发布需求）

Markdown 的适用人群

• 程序员、科研工作者（使用较多，技术文档、技术博客等）
• 博客博主（写博文）
• 作家（撰写文章、书籍等）
• 学生（辅助LaTeX 数学公式，笔记、论文等）
• 其他（文字录入、笔记整理等）

Markdown 编辑工具

参考文章：几款主流好用的markdown编辑器介绍（CC 4.0 BY-SA 协议许可，参考部分原文作修改）

按照 Markdown 编辑器的使用环境，可以将它们归纳为三类。

1. 平台集成工具：各大在线博客、社区平台自带的写作工具，比如 CSDN、博客园、GitHub 等。
2. 独立软件类：下载到自己机器上使用的独立产品，可以编辑本地文件，比如 Mou、Typora 等（以下的 Markdown语法示例截图中 使用的是 MarkdownPad、Typora及CSDN 编辑器显示效果）。
3. 插件类：它自己本身是不能独立使用的，可在你现有的编辑器中安装，使你现有的编辑器具有Markdown的功能，比如 Atom、WebStorm、Sublime Text 等。

这三类软件分别面向三类Markdown用户，大家可以根据自己的需求来选择使用。下面列举了部分常用的 Markdown 编辑器：

1. 平台集成

• CSDN：https://www.csdn.net/
• 博客园：https://www.cnblogs.com/
• GitHub：https://github.com/
• 更多：…

2. 独立软件

• MarkdownPad，Markdown文本编辑器

  官网下载：http://markdownpad.com/

  支持系统：Windows

  MarkdownPad 被很多人称赞为windows下最好用的Markdown编辑器之一。其支持键盘快捷键和工具栏操作，支持即时HTML预览及自动滚动至当前编辑位置、自定义配色方案、字体、大小和布局等，可以导出HTML和PDF。其HTML输出显示中规中矩、比较稳定，但部分语法显示需要些许设置。

• Mou，Markdown文本编辑器

  官网下载：http://25.io/mou/

  支持系统：macOS

  Mou 是一个面向开发者的Markdown编辑器。其具有语法高亮、实时预览、同步滚动、自动保存、自动补全、自定义主题和以CSS/HTML/PDF格式导出文件等特性。支持在编辑器内内联HTML代码，并且对中文，日文和韩文的输入非常友好。

• Typora，Markdown文本编辑器

  官网下载：https://www.typora.io/

  支持系统：Windows、macOS、Linux

  Typora 是非常有名、非常好用的 Markdown编辑器。支持数学编辑、可与 Word 进行格式转换、进行多种文档格式转换等，并且流畅度和反应速度都很快。Typora 同样支持实时预览，不同于左右两个窗口的编辑器，它将「写字」和「预览」这两件事情合并了，Typora的设计理念就是极致简洁，编
  辑后直接渲染出效果以“即时预览”，如果要修改已经写好的Markdown标记可以切换到“源代码模式”。

• Mark Text，开源Markdown编辑器

  github下载：https://github.com/marktext/marktext

  支持系统：Windows、macOS、Linux

  Mark Text 是一个简单而优雅的开源 Markdown编辑器，专注于速度和可用性。具有简洁的外观和流畅的运行。支持实时预览、数学表达式 (KaTeX)、前端和表情符号、直接从剪贴板粘贴图像、HTML和PDF文件输出等多种功能。

• more …

3. 插件拓展

• Atom，跨平台文本编辑器

  官网下载：https://atom.io/

  github下载：https://github.com/atom/atom

  汉化插件：https://github.com/chinakids/atom-simplified-chinese-menu/

  汉化方法：将下载好后的汉化包文件夹解压到 当前用户目录下的.atom\\packages文件夹中 并重启Atom编辑器（windows系统路径：C:\\Users\\用户名\\.atom\\packages，linux系统路径：~/.atom/packages）。

  支持系统：Windows、macOS、Linux

  Atom 可以说是专门为程序员推出的一个文本编辑器，界面简洁，支持实时预览。Atom 由著名的GitHub平台出品，是独立的软件，也支持插件方式。Atom功能非常多，除了Markdown同时支持CSS，HTML，JavaScript等网页编程语言，还支持宏定义，自动分屏功能等。

• Microsoft Visual Studio Code (VScode)，跨平台代码编辑器

  官网下载：https://code.visualstudio.com/

  支持系统：Windows、macOS、Linux

  Visual Studio Code 是一个轻量级但功能强大的代码编辑器。支持几乎所有主流的开发语言的语法高亮、智能代码补全、自定义热键、括号匹配、代码片段、代码对比 Diff、GIT 等特性，支持插件扩展。在用VScode打开Markdown文件后，点击右上角第一个按钮即可打开“预览”实时查看。

• Sublime Text，文本编辑器

  官网下载：http://www.sublimetext.com/

  支持系统：Windows、macOS、Linux

  Sublime Text 界面简约大方，定位专业，功能强大，并具有良好的扩展功能。支持的编程语言有十几种，并可通过第三方插件无限扩充。Sublime Text 默认不能实时预览，可通过 Markdown Preview 插件 来实现该功能。

• more …

Markdown 基本语法

Markdown 语法文档：标准 Markdown 语法指南（John Gruber）

对于未被Markdown语法涵盖的任何标记，只需使用HTML本身。没有必要对其进行前缀或分隔，以表明您正在从Markdown切换到HTML，您只需使用这些标记即可。唯一的限制是块级的HTML元素，如 <div>,<table>,<pre>, <p> 等标签，必须用空行分隔周围的内容，块的开始和结束标记不应缩进制表符或空格。应注意，在 HTML 区块标签间的 Markdown 格式语法将不会被处理。

快捷键

1. 标题

要创建标题，只要在标题文本前添加 1~6个 # 字符即可，使用的 #数量 将决定标题的大小，总共六级标题。建议在#号后加一个 空格，这是最标准的 Markdown 语法。

# 标题1
## 标题2
### 标题3
#### 标题4
##### 标题5
###### 标题6

示例：标题

标题索引（内容目录）：合理的创建标题，有助于目录的生成。使用 [TOC] 以创建当前文档目录（由于编辑器的差异，对目录创建的语法支持及语法规则应视实际使用的编辑器而定）。

示例：标题索引（目录）

2. 文本

• 强调文本

  可以使用粗体、斜体来表示强调，文本突出表示标记。

  用 2个星号 * 或 下划线 _ 包含一段文本就是粗体的语法，

  用 1个星号 * 或 下划线 _ 包含一段文本就是斜体的语法，

  用 2个波浪线 ~ 包含一段文本就是删除文本的语法，

  用 2个等号 = 包含一段文本就是标记文本的语法（扩展语法）。

  粗体文本：**粗体文本**  __粗体文本__
  斜体文本：*斜体文本*    _斜体文本_
  删除文本：~~删除文本~~
  标记文本：==标记文本==
  

  示例：粗体、斜体、删除、标记

  粗体文本

  斜体文本

  删除文本

  标记文本

  

• 键盘文本

  使用 HTML 的 <kbd> 标签。

  加粗：<kbd>Ctrl/Command</kbd> + <kbd>B</kbd>
  斜体：<kbd>Ctrl/Command</kbd> + <kbd>I</kbd>
  

  示例：键盘文本

  

3. 列表

Markdown的列表支持有序列表、无序列表以及特殊的任务列表。

1. 有序列表：就是有顺序的列表，使用 数字、英文句点 后面加一个 空格 作为列表标记。

   需要注意的是，用于标记列表的实际数字对Markdown输出的HTML结果没有任何影响。顺序不等或相同的数字都将得到完全相同的HTML输出。

   1. 有序列表1
   2. 有序列表2
   4. 有序列表3
   

   示例：有序列表（数字编号不影响最终输出的HTML结果）

   

   列表嵌套可使列表项包含多个段落。列表项中的 每个后续段落必须缩进 4个空格 或 1个制表符，代码块需要缩进 8个空格 或 2个制表符：

   1. 有序列表1
      有序列表1的 段落
       > 有序列表1的 引用
           //有序列表1的 代码块
           use the printf() function;
   1. 有序列表2
   

   示例：有序列表中的的多个段落

   

   值得注意的是，以下示例中的编写会意外地触发一个有序列表，为了避免这种情况，可以反斜线 \\ 转义句点：

   2022. 北京冬季奥运会
   2022\\. 北京冬季奥运会
   

   示例：为避免触发有序列表，应对句点进行转义

   

2. 无序列表：就是列表不排序，使用 减号 - 、星号 * 或 加号 + 作为列表标记，符号后须加上 空格。

   无序列表有3种列表符，分别用于表示1级列表、2级列表、3级列表。行尾回车换行后会自动接续列表，再次按Tab会标记段落并更换列表符/再次按回车会清除列表符。

   - 1级列表
       * 2级列表
       * 2级列表
           + 3级列表
           + 3级列表
   - 1级列表
   - 1级列表
   

   示例：无序列表

   

3. 任务列表：非常实用，管理待办已办非常便利。

   在列表项目前面加 1个减号 - 及 空格 、并紧跟 方括号 [ ] 作为待办任务标记，使用 [x] 将任务标记为已完成。

   - [ ] 任务列表（待办任务）
   - [x] 任务列表（完成任务）
   

   示例：任务列表

   • 任务列表（待办任务）
   • 任务列表（完成任务）

   

   
   

   MarkdownPad 任务列表不显示：MarkdownPad 显示设置——任务列表显示

4. 引用

区块引用是在段落开头使用 右尖括号 > ，并紧跟一个 空格 来引用文本。也可再次添加 > 嵌套引用。

> 引用1
>> 引用2
>
> 引用1

示例：引用及其嵌套

引用的区块中也可以包含其它Markdown元素，包括标题、列表、代码块等。

> ## 标题
>
> 1. 有序列表1
> 2. 有序列表2
>
> - 无序列表
>     - 无序列表
>
> 代码示例：
>
>     use the printf() function;

示例：引用及其它元素嵌套

5. 代码

在代码块中，符号(&) 和尖括号(<和>) 会被自动转换为HTML实体。这使得使用Markdown包含HTML源代码变得非常容易——只需粘贴并缩进它，Markdown就可以对特殊字符自动转义，减免了处理编码特殊字符的麻烦。

1. 代码片 (内联代码块)

   引用代码时，如果引用的语句只有一段，仅作为普通段落中的代码，可使用 1个反引号 ` 将其包起来。反引号中的文本不会被格式化。

   Use the `printf()` function;
   

   示例：代码片

   

2. 代码块 (围栏代码块)

   引用代码时，如果引用的语句为多行，可在代码行首缩进 4个空格 或 1个制表符 (Tab) ，也可以使用 3个反引号 ` 置于代码的首行和末行。

   示例：代码块

   

   
   

   MarkdownPad 三个反引号对代码块无作用：MarkdownPad 显示设置——三个反引号作用于代码块

   语法高亮：要将代码或文本格式化为各自的不同块，可使用 3个反引号 ` 包裹一段代码，并在首行反引号后面指明 语言标识符。

   ```[语言标识符]
     在这里插入代码
   ```
   例如：
   ```javascript
     // An highlighted block
     var foo = "bar";
   ```
   

   示例：代码块 语法高亮

   

   
   

   MarkdownPad 语法无高亮：MarkdownPad 显示设置——语法高亮

6. 链接与图像

插入链接与插入图片的语法很像，区别在一个 ! 号

链接： [链接文字](URL地址 可选title属性)
图像：![图像描述文字](URL地址 可选title属性)

示例：链接、图像

Markdown没有用于指定图像尺寸的语法，如果你需要的话，你可以使用普通的 <img> 标签。

插入图片的地址需要图床，图床工具用于上传图片获取URL地址。

Markdown支持两种链接样式：内联链接 和 引用链接。在这两种样式中，链接文字都是用 方括号 [] 来标记。链接和图像使用方式相同。

1. 内联链接

   创建内联链接，将链接文字包含在 方括号 [] 中，并紧跟着 小括号 () 。在括号内，指定链接的URL，可选地，空格 后面跟着链接的 title属性，用 双引号（推荐）、单引号 或 小括号 包围起来。

   例如：

   This is [an example](http://example.com/) inline link.

   [This link](http://example.com/ “Title”) has title attribute.

   如果你引用的是同一路径下的本地资源，可以使用相对路径：

   See my [About](/about/) page for details.

2. 引用链接

   引用链接是在链接文字的括号后面再接上 第二组方括号，在其中填入用以 辨识链接的标签：

   This is [an example][1] reference-style link.

   然后，在文档中的任何地方，都可以像这样 在一行中定义链接标签：

   [1]: http://example.com/ “Optional Title Here”

   你可以将title属性放在下一行，并为其使用额外的空格或制表符，使用更长的URL时看起来更好：

   [1]: http://example.com/longish/path/to/resource/here/…

   “Optional Title Here”

   辨识链接的标签名 可由字母、数字、空格和标点符号组成，它们是 不区分大小写 的。例如，以下这两个链接是等价的：

   [link text][a]

   [link text][A]

   
   

   隐式链接名 允许你省略链接标签的名称，在这种情况下，链接文字本身 将用作名称。只需在链接文字后面加上 一组空的方括号。你可以简单地写：

   [Baidu][]

   然后定义链接：

   [Baidu]: https://www.baidu.com/

   由于链接名称可能包含空格，此快捷方式甚至 适用于链接文字中的多个单词：

   Visit [Baidu Products][] for more information.

   然后定义链接：

   [Baidu Products]: https://www.baidu.com/more/

   
   

   链接标签定义可以放在Markdown文档中的任何位置。一般它们被放在使用它们的每一段之后，但是如果你想的话，你可以把它们都放在文档的末尾，就像脚注一样。

   例如：Baidu, Alibaba and Tencent are all Chinese Internet companies.

   下面是一个 引用链接 的示例：

   [Baidu][1], [Alibaba][2] and [Tencent][3] are all Chinese Internet companies.

   [1]: https://www.baidu.com/ “Baidu”

   [2]: https://www.alibaba.com/ “Alibaba”

   [3]: https://www.tencent.com/ “Tencent”

   使用 隐式链接名 的方式，你可以编写：

   [Baidu][], [Alibaba][] and [Tencent][] are all Chinese Internet companies.

   [Baidu]: https://www.baidu.com/ “Baidu”

   [Alibaba]: https://www.alibaba.com/ “Alibaba”

   [Tencent]: https://www.tencent.com/ “Tencent”

   为了与以上引用链接进行比较，下面是使用 内联链接 编写的相同段落：

   [Baidu](https://www.baidu.com/ “Baidu”), [Alibaba](https://www.alibaba.com/ “Alibaba”) and [Tencent](https://www.tencent.com/ “Tencent”) are all Chinese Internet companies.

   引用式链接的要点并不是它们更容易编写。关键是，有了引用样式的链接，可大大提高文档的可读性。使用Markdown的引用样式链接，源文档更类似于在浏览器中呈现的最终输出结果。让你可以把一些标记相关的元数据移到段落文字之外，你就可以增加链接而不让文章的阅读感被打断。

自动链接

Markdown支持以比较简短的自动链接形式来处理URL和电子邮件地址：只需用 尖括号 <>（推荐）环绕URL/电子邮件地址 或 直接书写 其地址即可，Markdown 就会自动把它转成链接。这意味着，如果你想 显示URL或电子邮件地址的实际文本，并让它成为可点击的链接，你可以这样做：

示例：直接书写 或 使用尖括号包围（推荐）以创建自动链接

http://example.com/

yourname@email.com

其它：脚注（扩展语法）

脚注的解释自动追加到文末（脚注的语法支持及语法规则应视实际使用的编辑器而定）。

示例：脚注

自定义脚注：编辑器不支持时，可使用 HTML 上标标签 和 链接语法 以手动构建：

1. 使用 HTML上标标签 在文档中定义脚注标记：<sup id="fnref1">[1](#fn1)</sup>
2. 使用 ↩ 字符在文档底部定义脚注内容的返回标记：<b id="fn1">[↩](#fnref1)</b>

注意：为使多个脚注能够跳转脚注及回到链接，脚注编号应每组对应、#与跳转id后面的值应相同。

7. 表格

Markdown 制作表格使用 竖线 | 来分隔不同的单元格，使用 横线 - 来分隔表头和其他行。

单元格的宽度可以不同，无需在列内准确对齐。标题行的每一列中必须至少有一个横线 （推荐3个以上）。

| 表头 | 表头 |
|  -  |  -  |
|单元格|单元格|

示例：一个简单的表格是这么创建的

列1	列2
1	2
1	2

MarkdownPad 表格不显示：MarkdownPad 显示设置——表格显示

对齐方式：在标题行中横线的左侧、右侧或两侧加入冒号 : ，以靠左、靠右或居中对齐列中的文本。

使用 :---: 设置内容和标题 居中对齐
使用 :---  设置内容和标题 居左对齐
使用  ---: 设置内容和标题 居右对齐
例如：
|第一列       |      第二列|第三列      |
|:----------:|----------:|:----------|
|第一列文本居中|第二列文本居右|第二列文本居左|

示例：表格对齐

第一列	第二列	第三列
第一列文本居中	第二列文本居右	第三列文本居左

8. 分隔线

在一行中使用 3个以上 连字符 – 、星号 * 或 下划线 _ 。行内不能有其他字符，但可以在其中插入空格。

示例：分隔线

9.1 数学公式（扩展语法）

LaTeX 数学公式 语法列表查询：https://katex.org/docs/supported.html

LaTeX 数学公式 在线编辑工具：https://latex.codecogs.com/eqneditor/editor.php

现已有不同的Markdown工具集成并丰富了更多的功能，如较为复杂的数学公式、流程图、时序图等，虽有多种工具的支持呈现，但更为复杂的功能或许专业的图形界面工具会更为方便、更有效率。选择适合自己的书写方法时，语法支持及语法规则还应视实际使用的编辑器而定。

数学公式：当你需要在编辑器中插入数学公式时，可以使用 2个美元符 $ 包裹 TeX 或 LaTeX 格式的数学公式来实现。

示例：数学公式

上标和下标：上标使用符号 ~ 包围、下标使用符号 ^ 包围。编辑器不支持时，可分别使用 HTML 标签 <sup>（superscript） 和 <sub>（subscript） 替代。

示例：上标和下标

2¹⁰，H₂O

使用 HTML 标签：

2¹⁰，H₂O

9.2 图表（扩展语法）

• Mermaid 流程图

  Mermaid 流程图 语法文档：https://mermaid-js.github.io/mermaid/#/flowchart

  

• Mermaid 时序图

  Mermaid 时序图 语法文档：https://mermaid-js.github.io/mermaid/#/sequenceDiagram

  

• Mermaid 甘特图

  Mermaid 甘特图 语法文档：https://mermaid-js.github.io/mermaid/#/gantt

  

• 查看 Mermaid 更多图表：https://mermaid-js.github.io/mermaid/#/

转义字符

Markdown 允许使用 反斜线 \\ 转义 来插入一些在语法中有特殊意义的符号，以使其输入为普通字符。

Markdown 为下列字符提供反斜线转义：

\\ 反斜线

` 反引号

* 星号

_ 下划线

花括号

[] 方括号

() 小括号

# 井号

+ 加号

- 减号（连字符）

. 英文句点

! 感叹号

语法技巧

1. 出现带有换行的段落、不同的 Markdown 语法时，尽量在换行后再多添加一个空行，使用空行将多个段落、不同的语法内容隔开，使得最终输出结果最大兼容不同的 Markdown编辑器、同步于编辑时的源文档排版结构。未添加空行将出现部分编辑器略过换行、将多个段落文字连续满行显示，而紧凑的语法内容未得到正常格式化使得语法失效或混乱。

2. 使用以上 Markdown 基本语法说明中给出“（推荐）”标示的选项。如 “自动链接” 中推荐使用 尖括号 <> 将链接地址包围，可最大兼容生成链接，而直接书写链接地址时部分编辑器未能生成自动链接。

Markdown 基本语法至此已经结束了，本文档全文即为 Markdown基本语法 本地预编辑 加在线导入实践，仅做了替换图像原URL地址并审查全文无误后直接发布。

Markdown 功能拓展与语法支持

基于以上 Markdown基本语法的 第三方增强语法支持，以下仅作举例说明。

CSDN 语法支持

1. 标题索引（目录）

使用 @[TOC](自定义目录标题) 创建目录

2. 图像

在图像URL地址后面拼接如下属性：

带尺寸的图片：空格=宽x高

居中的图片：#pic_center

右对齐的图片：#pic_right

CSDN编写的文档在其它编辑器打开时，其中设置过对齐属性的图像可能显示失败，须恢复为源链接：

为适配兼容其它 Markdown编辑器，可使用HTML <img> 等标签：

<div align="center">
    <img src="https://img-blog.csdnimg.cn/20210405103436678.png"/>
</div>

3. 注释

相当于 HTML <abbr> 标签，正文所有相关词自动匹配：

4. Flowchart 流程图

Flowchart 流程图 语法文档：http://flowchart.js.org/

GitHub 语法支持

1. emoji表情

通过键入 :EMOJICODE: 可在您的写作中添加表情符号。键入 : 将显示建议的表情符号列表。列表将在您键入时进行过滤，因此一旦找到所需表情符号，请按 Tab 或 Enter 键以填写选中的结果。

表情符号支持列表 表情备忘单：https://github.com/ikatyang/emoji-cheat-sheet/blob/master/README.md

@cat :+1: 这个 PR 看起来很棒 - 可以合并了！ :laughing:

…

结语

一顿操作哦吼吼，这篇 Markdown语法指南 作为我的开篇博客，希望能够帮助到有需要的朋友哦！这篇文档不仅可以有效帮助到刚入门 Markdown 的小白 👍，也希望对 Markdown 已有了解的高玩提供更多帮助 😆 。文中如有疏漏还请大佬指出改正，后续会继续补充完善哒。