说说 Markdown 那些事儿Markdown 是一种轻量级标记语言，是由 John Gruber 2004 年创建的

Markdown 是一种轻量级标记语言，是由 John Gruber 2004 年创建的。它允许我们使用易读易写的纯文本格式编写文档，然后转换成有效的 XHTML（或者 HTML）文档进行呈现。

Markdown 有轻量化、易读易写等特性，并且对于图片，图表、数学式都支持。所以，当前许多网站都广泛使用 Markdown 来撰写、发表文档。

那该怎样去编写并且编写出更好的 Markdown 文档呢？下面将为你一一揭晓。

基础语法

Markdown 的语法全由一些符号所组成，易读易写。以下这些基础语法是我觉得大家一定要记住，不依靠 Markdown 编辑器就可以直接编写的。

标题

用法：在文字前面添加 #，添加 # 的个数代表几级标题

# h1 一级标题
## h2 二级标题
### h3 三级标题
#### h4 四级标题
##### h5 五级标题
###### h6 六级标题

字体加工

加粗

用法：在文字两头都加上两个 *，且 * 与文字间不要有空格

加粗的文字

**加粗的文字**

斜体

用法：在文字两头都加上一个 *，且 * 与文字间不要有空格

斜体的文字

*斜体的文字*

横线

用法：在文字两头都加上两个～，且～与文字间不要有空格

~~横线的文字~~

~~横线的文字~~

链接

普通链接

用法：[链接描述](链接URL)

github(可以直接点我跳转)

[github(可以直接点我跳转)](https://github.com/)

图片链接

用法：![图片名称](图片URL)

![掘金logo](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-assets/v3/static/img/logo.a7995ad.svg~tplv-t2oaga2asx-image.image)

代码块

用法：使用 ` 前后包住代码片段，基于不同编程语言可以通过添加编程语言名称进行不同语言的代码片段的展示

function helloWorld () {
    return 'Hello World! This is Javascript!';
}

```javascript
function helloWorld () {
    return 'Hello World! This is Javascript!';
}
```

列表

无序列表

用法: 使用*、+、—作为列表标记

无序列表一

无序列表二

无序列表三

* 无序列表一
+ 无序列表二
- 无序列表三

有序列表

用法: 使用数字加一个英文句点

有序列表一
有序列表二
有序列表三

1. 有序列表一
2. 有序列表二
3. 有序列表三

表格

用法: 按要求组合 | 与 -

Column1	Column2
Row1
Row2
Row3

|Column1  |Column2  |
|---------|---------|
|Row1     |         |
|Row2     |         |
|Row3     |         |

引用

用法: 使用符号 > 标记区块引用

此处是区块引用

此处是嵌套区块引用

> 此处是区块引用
>> 此处是嵌套区块引用

分割线

用法: 使用三个以上的 *、-、_ 来建立一个分隔线，行内不能有其他字符

********************
--------------------
____________________

高级用法

学习了以上基础的语法之后，基本的 Markdown 文档是没问题了。下面介绍一些能够为你的文档添加亮点的高级用法。

添加表情

枯燥的文字读多了会有催眠的效果，所以此时我们可以添加一些表情，增强文章的可读性，生动性。如以下表情：

:smile: :laughing: :yum: :heart: :smiling_imp:

:smile: :laughing: :yum: :heart: :smiling_imp:

更多的表情参考 www.webfx.com/tools/emoji…

任务列表

在写技术文档说到主要功能的时候，可以用任务列表将包含的功能进行列举出来。

项目管理
数据源管理
授权与安全
运维中心
算法实验

- [x] 项目管理
- [x] 数据源管理
- [ ] 授权与安全
- [x] 运维中心
- [ ] 算法实验

HTML 标签的使用

在 Markdown 中，我们可以使用 HTML 标签，让内容得到更好的表达。下面介绍一些使用 HTML 标签的案例。

脚注

如果你跳进一个黑洞¹ ，你的物质和能量² 将以一种被撕裂的形式返回到我们的宇宙中。

如果你跳进一个 黑洞<sup>1</sup> ，你的物质和 能量<sup>2</sup> 将以一种被撕裂的形式返回到我们的宇宙中。

文本高亮

与怪物战斗的人，应当小心自己不要成为怪物。当你远远凝视深渊的时候，深渊也在凝视着你。

与怪物战斗的人，应当小心自己不要成为怪物。<mark>当你远远凝视深渊的时候，深渊也在凝视着你。</mark>

文本颜色

从来如此，便对么？

从来如此，便 <font color="red">对</font> 么？

内容折叠

折叠内容

这里可以写超级多的 TO DO LIST
这里是可以被折叠起来的

<details>
<summary>折叠内容</summary>

- 这里可以写超级多的 TO DO LIST
- 这里是可以被折叠起来的

</details>

分栏

可能的话，我还是愿意永远这么年轻，不经受世事磨难，静静的生活下去，当然这是不可能的。
对于将来的梦想，以及刻骨铭心的恋爱等等，即便描绘不出来，我也朦朦胧胧怀有这样的期待的。

<div style="columns: 2;">可能的话，我还是愿意永远这么年轻，不经受世事磨难，静静的生活下去，当然这是不可能的。<div>
对于将来的梦想，以及刻骨铭心的恋爱等等，即便描绘不出来，我也朦朦胧胧怀有这样的期待的。

添加锚点

当我们写的文章很长时，就需要用到索引，让读者能够跳转到文章指定部分。这个时候，我们就需要在文章中添加锚点。

在需要跳转到的标题位置添加链接：<a name="锚点名称">标题一</a>
添加链接：<a href="#要跳转到的锚点名称">标题一</a>

跳转至表格

Mermaid

在比较大的业务场景、或复杂逻辑介绍的时候，使用图进行表达会更加直接。这个时候我们呢可以借助 Mermaid。

Mermaid 是一个工具，旨在使图表和流程图的文档，更容易。通过 Mermaid ，我们可以在 MarkDown 中以特定格式的文字生成流程图或是图标。

下面用流程图进行举例，介绍 Mermaid 的使用。

Flowcharts

用法与代码块的类似，将定义的语言设置为 mermaid 即可。

```mermaid
graph LR
    START[开始] --> DEAL[处理] --> END[结束]
```

流程图流向:

LR（Left-Right 从左至右）

TB（Top-Bottom 从上至下）

RL（Right-Left 从右至左）

BT（Bottom-Top 从下至上）

节点：

START[开始] 四四方方的节点

START(开始) 有圆边的节点

START([开始]) 体育场形状的节点

...

连接：

A --> B 带尖头实线连接

A -.-> B 带尖头虚线连接

A --- B 开放连接

...

更多使用方法，查看 mermaid-js.github.io/mermaid/#/

添加项目文件目录

在编写项目的 README.md 的时候，一般会对整个项目的文件目录结构做个简单的说明。我们可以借助以下命令直接生成当前项目的目录结构。

tree-node-cli

全局安装：npm install -g tree-node-cli

执行命令：tree -L 4 -I "node_modules" > README.md

-L 是确定要几级目录 -I 是排除哪个文件夹下的目录最后指定在 README 里面生成项目结构树

markdown
├── README.md
├── markdownPractice.md
└── src
    ├── api
    │   └── index.js
    └── public
        └── index.html

更多参数说明，查看 www.npmjs.com/package/tre…

mddir

全局安装：npm install mddir -g

执行命令：mddir './'

|-- Desktop
    |-- .DS_Store
    |-- README.md
    |-- markdownPractice.md
    |-- src
        |-- api
        |   |-- index.js
        |-- public
            |-- index.html

更多用法，查看 www.npmjs.com/package/mdd…