一、前言
什么是 Markdown
Markdown 是一种轻量级标记语言，别名 MD，文件后缀格式（文件名.md），创始人为约翰·格鲁伯（John Gruber）。 它允许使用易读易写的纯文本格式编写文档，然后转换成有效的 XHTML（或者HTML）文档，这也意味着 md 可以兼容 HTML 语法。
Markdown 具有轻量化、易读、易写等特性，并且对图片，图表、数学公式都支持，许多网站都广泛使用 Markdown 来撰写帮助文档或博客系统。
二、插入
2.1 插入标题
| 语法说明 | 示例 | 渲染结果 |
|---|---|---|
| 1个#号+空格键+标题名 | # 一级标题 | 一级标题 |
| 2个#号+空格键+标题名 | ## 二级标题 | 二级标题 |
| 3个#号+空格键+标题名 | ### 三级标题 | 三级标题 |
| 4个#号+空格键+标题名 | #### 四级标题 | 四级标题 |
| 5个#号+空格键+标题名 | ##### 五级标题 | 五级标题 |
| 6个#号+空格键+标题名 | ###### 六级标题 | 六级标题 |
至多6级标题（6个#号）
知识扩展：
在文本下一行用一个或多个等号=表示一级标题；一个或多个短横线-表示二级标题
- 示例
一级标题 ======= 二级标题 -------
2.2 插入目录
| 语法说明 | 在 md 中的任何位置，加入[TOC]字样，即可自动生成目录结构，推荐将其添加在文首，方便进行内容导航。 不同的 md 软件工具，展示的格式可能有所不同，但依然遵循该语法格式 |
| 示例 | [TOC] |
| 渲染结果 |  |
2.3 插入脚注
| 语法说明 | 在需要添加脚注的文字后加上脚注名字[^脚注名字]，称为加注。 然后在文本的任意位置(一般在最后)添加脚注，脚注前必须有对应的名字。脚注通常用来标注文章中引入的文献或者注解 |
| 示例 | Markdown [^1] 可以书写技术博客和个人笔记，可以很方便直接转换成 TEXT 和 HTML [^2]。 [^1]:Markdown Markdown 是一种轻量级标记语言，别名 MD，文件后缀格式（文件名.md） [^2]:HTML HTML 是一种标记语言，全称为超文本标记语言 |
| 渲染结果 |  |
踩坑：
① 经过本人实测，脚注与脚注之间必须空一行，否则会导致脚注失效
② 即使没有将脚注写在文末，Markdown 会对其进行优化转换，自动归类到文末
2.4 插入图片
| 语法说明 | 语法格式：，语法中图片名称的意思是如果图片因为某些原因不能显示，就用定义的图片名称文字来代替图片。 鼠标悬停展示内容则和链接中的 Title 一样，表示鼠标悬停在图片上时出现的文字。 图片名称和 鼠标悬停展示内容 都不是必须的，可以省略，为了增强可读性，建议写上 |
| 示例 |  |
| 渲染结果 |  |
2.5 插入分割线
| 语法说明 | 3个及以上的横杠(-)、下划线(_)、星号(*)，可包含空格，但必须单独一行 |
| 示例 | * * * *** **** - - - ----------- |
| 渲染结果 |  |
2.6 插入链接
2.6.1 页内超链接
| 语法说明 | 语法格式：[内容](链接地址 "title") ，[] 里写链接文字，() 里写链接地址, () 中的 "" 中可以为链接指定 title 属性，title 属性可加可不加。title 属性的效果是鼠标悬停在链接上会出现指定的 title 文字，链接地址与 title 前有一个空格 |
| 示例 | 欢迎访问 [百度](https://www.baidu.com "https://www.baidu.com") 主页 [Markdown Emoji 图标列表](https://blog.csdn.net/w10154475/article/details/136254361?spm=1001.2014.3001.5502 "Emoji 图标列表") |
| 渲染结果 | 欢迎访问 百度 主页 Markdown Emoji 图标列表 |
2.6.2 参考式超链接
参考式超链接一般用在学术论文中，或者某一个链接在文章中需要多处使用，那么参考式链接会非常好用，且方便对链接统一管理。
| 语法说明 | 语法格式： [链接文字][链接标记]，在文本任意位置添加[链接标记]:链接地址 |
| 示例 | 我经常去的几个网站 [Google][1]、[Leanote][2] 和 [百度][3] 此处一定要换行，否则不生效 [1]:http://www.google.com [2]:http://www.leanote.com [3]:https://www.baidu.com |
| 渲染结果 | 我经常去的几个网站 Google、Leanote 和 百度 |
2.6.3 自动连接
| 语法说明 | Markdown 支持以比较简短的自动链接形式来处理网址和电子邮件信箱，只需要是用 <> 包起来， Markdown 就会自动将它转成链接，一般网址的链接文字就和链接地址一样 |
| 示例 | <http://example.com> <https://www.baidu.com> <address@example.com> |
| 渲染结果 | http://example.com https://www.baidu.com address@example.com |
2.6.4 图片式超链接
| 语法说明 | 语法格式：[](连接地址) |
| 示例 | [](https://www.baidu.com) |
| 渲染结果 |  |
2.7 插入表格
Markdown 支持两种语法格式的表格形式，一个是 Markdown 语法；二是 HTML 语法。Markdown 语法相对比较简单，能够实现一些简单场景下的表格样式，HTML 语法可以实现较为负责场景的表格样式。
2.7.1 Markdown 表格
| 语法说明 | Markdown 表格语法相对简单，支持任意行列数表格的绘制，第一行固定为表头，文字加粗，底色为浅蓝色。其他行文字不加粗，底色白灰相间。行高和列宽自动分布，不支持调整。支持文本居左、居中、居右的调整，每一列的文本位置会保持一致。字号比正文小一号，不支持调整 ① 表格中文本换行需要使用 <br>标签进行换行② 单元格之间以 | 相隔③ 表头与表格内容间固定有一行 - ，- 需要一个及以上。- 左边加 : 或者不加 : 代表居左；- 右边加 : 代表居右；- 两边都加代表居中④ 可以不添加表头，但是必须要有 - 固定行 |
| 示例 | 1. 样式一 |居中|居右|居左| | :-: | --: | :------ | | 居中使用:-: | 右对齐使用-: | 左对齐使用:-| |aa|aaaa|aaaa| |bb|bbbbbbb|bbbbbbb| 2. 样式二 居中|居右|居左 :-: | --: | :------ 居中使用:-: | 右对齐使用-: | 左对齐使用:- aa|aaaa|aaaa bb|bbbbbbb|bbbbbbb 3. 样式三 <center> 此处需要换一行，否则不生效 |居中|居右|居左| | :-: | --: | :------ | | 居中使用:-: | 右对齐使用-: | 左对齐使用:- | |aa|aaaa|aaaa| |bb|bbbbbbb|bbbbbbb| </center> |
| 渲染结果 |  |
2.7.2 HTML 表格
2.7.2.1 HTML 表格语法
| 代码 | 含义 | 备注 |
|---|---|---|
<table> | 表格开始 | |
</table> | 表格结束 | |
<capital> | 标题开始 | |
</capital> | 标题结束 | |
<tr> | 表格行 (table row) 开始 | |
</tr> | 表格行 (table row) 结束 | |
<td> | 单元格 (table datagrid) 开始 | |
</td> | 单元格 (table datagrid) 结束 | |
<th> | 表头 (table header) 开始 | 替代 <td>，改变单元格为表头格式 |
</th> | 表头 (table header) 结束 | 替代 </td>，改变单元格为表头格式 |
2.7.2.2 HTML 表格格式约束
表格约束语句位于各个开始标签内，> 后括号之前，多个约束语句以空格相隔。
| 代码 | 含义 | 备注 |
|---|---|---|
align = "left" | 居左 | |
align = "center" | 居中 | |
align = "right" | 居右 | |
bgcolor = "white" bgcolor = #FFFFFF | 背景颜色 | “white” 可替换为 “black”、“blue” 等其他颜色名称 #FFFFFF 可替换为其他 #+6位16进制数 格式的颜色代码对表头无效 |
width = "100px" width = "10%" | 列宽 | “100px” 可替换为其他数字 “10%” 可替换为其他百分数 同一列多个单元格有此命令时，优先服从大数值 |
colspan = x | 水平合并单元格 | x为数字，代表这个格子占x列 |
rowspan = y | 竖直合并单元格 | y为数字，代表这个格子占y行 |
2.7.2.3 HTML 文本格式语句
| 代码 | 含义 | 备注 |
|---|---|---|
<b> | 开始加粗 | |
</b> | 停止加粗 | 如单元格后续没有不加粗的内容可省略 |
<i> | 开始斜体 | |
</i> | 停止斜体 | 如单元格后续没有不斜体的内容可省略 |
<mark> | 开始高亮 | |
</mark> | 停止高亮 | 如单元格后续没有不高亮的内容可省略 |
<br> | 换行 | |
<img src = "图片地址"> | 插入图片 | |
2.7.2.4 HTML 表格示例
<table>
<capital>在 Markdown 中绘制复杂表格：</capital>
<tr>
<th>横向普通表头</th>
<th align="right"><i>右对齐斜体表头</i></th>
<th colspan=2>横向合并2个单元格表头</th>
<td width="20px">限制列宽为80px单元格超出会自动换行</td>
</tr>
<tr>
<th>纵向普通表头</th>
<td bgcolor="red">红色单元格</td>
<td><mark>高亮文字</mark>非高亮文字</td>
<td><b>加粗文字</b><i>斜体文字</i></td>
<td width="10px">10px小于20px，优先20px的列宽</td>
</tr>
<tr>
<td>表头不一定是一整行或者一整列的</td>
<td rowspan=2>纵向合并单元格<br>下一行少一个单元格<br>字太多自动换行</td>
<td rowspan=2 colspan=2>横向纵向合并2个单元格</td>
<td rowspan=2 width="30%">纵向合并2个单元格，列宽像素与百分比可混合使用，优先大数值</td>
</tr>
<tr>
<td align="left"> 文字左对齐 </td>
</tr>
</table>
2.7.2.5 HTML 表格渲染效果
在 Markdown 中绘制复杂表格：| 横向普通表头 | 右对齐斜体表头 | 横向合并2个单元格表头 | 限制列宽为80px单元格超出会自动换行 | |
|---|---|---|---|---|
| 纵向普通表头 | 红色单元格 | 高亮文字非高亮文字 | 加粗文字斜体文字 | 10px小于20px，优先20px的列宽 |
| 表头不一定是一整行或者一整列的 | 纵向合并单元格 下一行少一个单元格 字太多自动换行 | 横向纵向合并2个单元格 | 纵向合并2个单元格，列宽像素与百分比可混合使用，优先大数值 | |
| 文字左对齐 | ||||
2.8 插入块语法
插入块主要有两种常用方式，一种是行内块，使用单个 ` 符号（在ESC键下方）包裹代码；另一种是多行块，使用 ``` 符号（在ESC键下方）包裹代码，如果块中包含的是程序代码，还能添加语言类型，在 ``` 符号后加上语言类型，js、java、HTML、css、C、C++ 等程序语言均可使用，不区分字母大小写。
| 行内块 | 多行块 | |
|---|---|---|
| 语法说明 | 语法格式： `块内容` （适合在文本内容中掺杂使用） | 语法格式： ``` 块内容 ``` |
| 示例 | Java 语言里的函数 `System.out.println()` 用法 | 1. 文本块 ``` public String[] selectImports (AnnotationMetadata annotationMetadata) { if (!this.isEnabled(annotationMetadata)) { return NO_IMPORTS; } else { AutoConfigurationEntry autoConfigurationEntry = this.getAutoConfigurationEntry(annotationMetadata); return StringUtils.toStringArray(autoConfigurationEntry .getConfigurations()); } } ``` 2. Java 程序块 ```java public String[] selectImports (AnnotationMetadata annotationMetadata) { if (!this.isEnabled(annotationMetadata)) { return NO_IMPORTS; } else { AutoConfigurationEntry autoConfigurationEntry = this.getAutoConfigurationEntry(annotationMetadata); return StringUtils.toStringArray(autoConfigurationEntry .getConfigurations()); } } ``` 3. JavaScript 程序块 ```js var foo = function (bar) { return bar++; }; console.log(foo(5)); ``` |
| 渲染结果 | Java 语言里的函数 System.out.println() 用法 |  |
2.9 插入注释
插入注释用三种方式，一是 div 标签；二是 HTML 注释；三是不常用的 hack 式。
div标签式 | HTML式 | |
|---|---|---|
| 语法说明 | 语法格式：<div style='display: none'>注释内容</div> | 语法格式：<!--注释内容--> 快捷键 Ctrl + / |
| 示例 | <div style='display: none'> 我是注释，不会在浏览器中显示。 </div> | <!--我是注释，不会在浏览器中显示。--> |
| 渲染结果 | 文档中注释不可见 | 文档中注释不可见 |
hack 式知识扩展：
[//]: # "我是注释，不会在浏览器中显示。" [^_^]: # (我是注释，不会在浏览器中显示。) [//]: <> "我是注释，不会在浏览器中显示。" [comment]: <> "我是注释，不会在浏览器中显示。"
2.10 插入 Emoji
| 经典写法 | 简写 | |
|---|---|---|
| 示例 | :wink: :cry: :laughing: :yum: | ;) :) 8-) :-) :-( :( :* |
| 渲染结果 | 😉 😢 😆 😋 | 😉 😃 😎 😃 😦 😦 😗 |
| 常见 Emoji 列表 | Markdown Emoji 图标列表 |
三、格式
3.1 换行
| 语法说明 | 语法格式：行结尾加2个空格或行结尾加1个\再回车 |
| 示例 | 1. 空格式 这是一句话不过我要在这里 换行且 再次换行 2. \式 这是一句话不过我要在这里\ 换行且\ 再次换行 |
| 渲染结果 |  |
知识扩展：
表格中不支持空格和\换行，可以使用<br>标签换行
3.2 段落
| 语法说明 | 语法格式：段落1 + 2个回车符 + 段落2，要形成段落，本质是在每段文本后按两次回车，如果只按一次回车，即使编辑时不在同一段落，展示时也会渲染到同一段落中 |
| 示例 | 1. 第一种，换行不加回车符，两段话会展示在同一个段落中 > 这是第一个段落。 这是第二个段落。 2. 第二种，换行加回车符，两段话不会展示在统一个段落中 > 这是第一个段落。 > > 这是第二个段落。 |
| 渲染结果 |  |
3.3 对齐方式
| 语法说明 | 语法格式： 标签实现 <center>，<p align="center">，<p align="left">，<p align="right"> |
| 示例 | > <center>行中心对齐</center> > <p align="center">行中心对齐</p> > <p align="left">行左对齐</p> > <p align="right">行右对齐</p> |
| 渲染结果 |  |
3.4 引用
| 语法说明 | 语法格式：大于号 > + 空格，引用可以嵌套使用 |
| 示例 | > 引用也可以连用 > > > 可以添加额外的大于号制造更深的引用 |
| 渲染结果 |  |
3.5 列表
3.5.1 无序列表
| 语法说明 | 语法格式：* 或 + 或 - 符号 + 空格，形成无序列表，如果为嵌套使用，则每行会展示不同的序列符号。 第一层，展示为实心圆 第二层，展示为空心圆 第三层，展示为实心正方形 |
| 示例 | * 无序列表项 + 无序列表项 * 列表中的列表项 * 更多的列表项1 + 更多的列表项2 - 更多的列表项3 - 列表中的长列表项，这个列表项很长。 而且由很多个段落构成。 - 无序列表项 |
| 渲染结果 |  |
3.5.2 有序列表
| 语法说明 | 语法格式：数字开头 + 英文点 + 空格，文本内容后回车形成累加序列号 |
| 示例 | 样式一 1. 有序列表第1项 1. 有序列表第2项 1. 有序列表第3项 样式二 2. 有序列表第1项 1. 有序列表第2项 1. 有序列表第3项 |
| 渲染结果 |  |
3.5.3 任务列表
| 语法说明 | 语法格式： ① 未勾选：横杠（ -） + [ ] + 空格 + 任务名称 ② 已勾选：横杠（ -） + [x] + 空格 + 任务名称 |
| 示例 | - [ ] 任务一 未做任务 - [x] 任务二 已做任务 |
| 渲染结果 |  |
3.6 转载
3.6.1 转载
| 语法说明 | 语法格式：<a href="转载文章的网址">转载文章的名字</a> |
| 示例 | 转载自 <a href="https://blog.csdn.net/w10154475/article/details/113820769?spm=1001.2014.3001.5502">Java修炼之凡界篇 筑基期 第01卷 入门 第01话 Java诞生</a> |
| 渲染结果 | 转载自 Java修炼之凡界篇 筑基期 第01卷 入门 第01话 Java诞生 |
3.6.2 含 ↩ 转载
| 语法说明 | 语法格式：<a href="转载文章的网址">转载文章的名字</a><a href="#fnref:wx" rel="nofollow" title="Return to article" class="reversefootnote">↩</a> |
| 示例 | 转载自 <a href="https://blog.csdn.net/w10154475/article/details/113820769?spm=1001.2014.3001.5502">Java修炼之凡界篇 筑基期 第01卷 入门 第01话 Java诞生</a><a href="#fnref:wx" rel="nofollow" title="Return to article" class="reversefootnote">↩</a> |
| 渲染结果 | 转载自 Java修炼之凡界篇 筑基期 第01卷 入门 第01话 Java诞生↩ |
3.6.3 含序列号和横线转载
| 示例 | <div class="footnotes"> 横线<hr> <ol> <li id="fn:wx">文章作者1（任意想输入的汉字）， <a href="转载文章的网址">转载文章的名称</a><a href="#fnref:wx" rel="nofollow" title="Return to article" class="reversefootnote">↩</a> </li> <li id="fn:kz">文章作者2， <a href="文章的网址">文章名称</a><a href="#fnref:kz" rel="nofollow" title="Return to article" class="reversefootnote">↩</a> </li> <li id="fn:wx2">文章作者3， <a href="http://blog.csdn.net/testcs_dn/article/details/45766819">文章名称</a><a href="#fnref:wx2" rel="nofollow" title="Return to article" class="reversefootnote">↩</a> </li> </ol> </div> |
| 渲染结果 |
四、文字
| 示例 | <font face="黑体">我是黑体字</font> <font face="微软雅黑">我是微软雅黑</font> <font face="STCAIYUN">我是华文彩云</font> <font color=#0099ff size=12 face="黑体">我是蓝色大黑体</font> <font color=gray size=5>我是灰色</font> <font color=#00ffff size=3>我也不知道什么颜色</font> |
| 渲染结果 | 我是黑体字 我是微软雅黑 我是华文彩云 我是蓝色大黑体 我是灰色 我也不知道什么颜色 |
4.1 字体
| 示例 | <font face="黑体">黑体字</font> <font face="微软雅黑">微软雅黑</font> <font face="华文彩云">华文彩云</font> <font face="宋体">宋体</font> <font face="楷体">楷体</font> <font face="等线">等线</font> |
| 渲染结果 | 黑体字 微软雅黑 华文彩云 宋体 楷体 等线 |
4.2 类型
| 示例 | 渲染结果 |
|---|---|
*斜体* _斜体_ **粗体** ***加粗斜体*** ~~删除线~~ ++下划线++ ==背景高亮== | 斜体 斜体 粗体 加粗斜体 下划线 背景高亮 |
4.3 大小
<font> 标签 | <h> 标签 | |
|---|---|---|
| 示例 | <font size=1>1尺寸</font><font size=2>2尺寸</font><font size=3>3尺寸</font><font size=4>4尺寸</font><font size=5>5尺寸</font><font size=6>6尺寸</font><font size=7>7尺寸</font> | <h1>想要放大的字体1</h1><h2>想要放大的字体2</h2><h3>想要放大的字体3</h3><h4>想要放大的字体4</h4><h5>想要放大的字体5</h5> |
| 渲染结果 | 1尺寸 2尺寸 3尺寸 4尺寸 5尺寸 6尺寸 7尺寸 | 想要放大的字体1想要放大的字体2想要放大的字体3想要放大的字体4想要放大的字体5 |
知识扩展：
<h>标签常用于编辑标题
4.4 颜色
4.4.1 颜色语法
| 语法说明 | 语法格式：<font color=颜色英文单词或颜色号数字>文本内容</font> |
| 示例 | <font color=blue>蓝色</font> <font color=#008000>绿色</font> <font color=Red>红色</font> |
| 渲染结果 | 蓝色 绿色 红色 |
4.4.2 常用颜色
| 颜色示例 | 渲染结果 |
|---|---|
<font color=NavajoWhite>颜色颜色颜色</font> | 颜色颜色颜色 |
<font color=Feldspar>颜色颜色颜色</font> | 颜色颜色颜色 |
<font color=SandyBrown>颜色颜色颜色</font> | 颜色颜色颜色 |
<font color=LightSalmon>颜色颜色颜色</font> | 颜色颜色颜色 |
<font color=Salmon>颜色颜色颜色</font> | 颜色颜色颜色 |
<font color=LightCoral>颜色颜色颜色</font> | 颜色颜色颜色 |
<font color=Pink>颜色颜色颜色</font> | 颜色颜色颜色 |
<font color=PaleVioletRed>颜色颜色颜色</font> | 颜色颜色颜色 |
<font color=HotPink>颜色颜色颜色</font> | 颜色颜色颜色 |
<font color=silver>颜色颜色颜色</font> | 颜色颜色颜色 |
<font color=LightSlateGray>颜色颜色颜色</font> | 颜色颜色颜色 |
<font color=SlateGray>颜色颜色颜色</font> | 颜色颜色颜色 |
<font color=grey>颜色颜色颜色</font> | 颜色颜色颜色 |
<font color=RosyBrown>颜色颜色颜色</font> | 颜色颜色颜色 |
<font color=maroon>颜色颜色颜色</font> | 颜色颜色颜色 |
<font color=DarkSeaGreen>颜色颜色颜色</font> | 颜色颜色颜色 |
<font color=LightSeaGreen>颜色颜色颜色</font> | 颜色颜色颜色 |
<font color=SeaGreen>颜色颜色颜色</font> | 颜色颜色颜色 |
<font color=PowderBlue>颜色颜色颜色</font> | 颜色颜色颜色 |
<font color=LightSteelBlue>颜色颜色颜色</font> | 颜色颜色颜色 |
<font color=CadetBlue>颜色颜色颜色</font> | 颜色颜色颜色 |
<font color=navy>颜色颜色颜色</font> | 颜色颜色颜色 |
4.5 底色
| 语法说明 | 借助 table, tr, td 等表格标签的 bgcolor 属性来实现背景色 ，将一整行看作一个表格，更改整个格子的背景色 | |
| 示例 | <table><tr><td bgcolor=HotPink>这里的背景色是：HotPink（粉色）</td></tr></table> | |
| 渲染结果 |
|
五、字符
5.1 转义字符
通常使用\反斜杠进行字符转义。
在 Markdwon 中有很多需要进行转义的特殊字符，常用的须转义的字符如表所示：
| 反斜杠 | \ | 反引号 | ` | 星号 | * | 下划线 | _ |
| 大括号 | {} | 中括号 | [] | 小括号 | () | 井号 | # |
| 加号 | + | 减号 | - | 英文句号 | . | 感叹号 | ! |
5.2 特殊字符
| 特殊字符 | 描述 | 字符的代码 |
|---|---|---|
| space | 空格符 | |
| < | 小于号 | < |
| > | 大于号 | > |
| & | 和号 | & |
| ￥ | 人民币 | ¥ |
| © | 版权 | © |
| ® | 注册商标 | ® |
| °C | 摄氏度 | °C |
| ± | 正负号 | ± |
| × | 乘号 | × |
| ÷ | 除号 | ÷ |
| ² | 平方（上标²） | ² |
| ³ | 立方（上标³） | ³ |
5.3 空格
| 名称 | 代码 | 长度 | 例子 |
|---|---|---|---|
| 窄空格 |   | 半个字母的宽度 | 12 34 效果：12 34 |
| 半角空格 |   | 一个字母的宽度 | 12 34 效果：12 34 |
不换行空格（常用） | | 常规空格的宽度 | 12 34 效果：12 34 |
| 全角空格 |   | 一个字的宽度 | 12 34 效果：12 34 |
1420
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
