Markdown

Markdown 是一种轻量级的标记语言，其用简单的标记语法便可达到排版的目的，其可以使我们更加专注于内容的编写，而不需过多关注排版。本文主要整理了 Markdown 中的常用的标记语法，以便自己与他人以后查用。

段落元素

1、段落与换行

Markdown 中的段落指连续的一段文字，编写时段落之间用至少一个空行隔开，段落内多个空格将被视为一个空格，段首不支持缩进。

如果想要在显示时显示多个空行，可以插入 <br/> 来实现，注意的是，插入的 <br/> 应与前后的段落中间至少空一行。

2、标题

Markdown 支持两种类型的标题。

//类型 1
这是一级标题
==========
这是二级标题
----------

//类型 2
# 这是一级标题
## 这是二级标题
...
###### 这是六级标题

从上面可以看出类型 1 是在标题下面插入 = 或者 - 来标识标题等级，但局限是其只能表示两个级别的标题。

类型 2 是在标题前面插入 1 - 6 个 # ，表示 6 个等级的标题，这是比较推荐的用法。

3、引用

Markdown 中使用 > 来引用。我们可以在一段文字中的每行开头加上 > 来表示一段引用文字，也可以只在一段文字的开头插入一个 > 来表示，如下面的 1、2 两种方式：

//方式 1
> 这是一句话
> 这是第二句话

//方式 2
> 这是一句话
这是第二句话

Markdown 支持使用不同数量的 > 表示嵌套引用。

> 这是外层的引用
> > 这是内层的引用

4、无序列表

无序列表使用 -、 + 或 * 来作为标记。

- 第一项
- 第二项
- 第三项

上面的 - 可以用 +、 *替换。需要注意的是，- 等符号与后面的文字至少空一格空格。

5、有序列表

有序列表使用数字和紧挨着的点号表示。

1. 第一项
2. 第二项
3. 第三项

同无序列表一样，标记符号与后面的文字至少空一格空格。但编辑时的数字对显示无影响。

2. 第一项
6. 第二项
1. 第三项

上面的例子与前一个显示的结果完全一致，但建议编辑时按照数字顺序。

列表

有序列表和无序列表的每一项中均可嵌套其他列表；
在列表项之间要插入段落时，这时需要将列表项之间的段落缩进 4 个空格；
使用 1\. 来输出 1.;

6、代码区块

缩进 4 个空格，需要注意的是，每行代码都需要至少缩进 4 个空格，不能像段落一样采用首行标记的偷懒写法，一个代码区会一直持续到没有缩进 4 个空格的那一行。

也可以用一对三个连续的撇号 ` 来包裹代码段。

```
code
```

有的解释器还能根据代码的语言从而给代码加上语法高亮。

```javascript
function func() {}
```

7、分割线

使用三个及以上的 *、 - 或 _来表示一个分割线，符号不能混用，符号之间可以插入多个空格。需要注意的是，使用 - 来插入分割线时需要与上一个段落至少空一行，否则 Markdown 会将上一行文字解释为二级标题。

8、表格

表格是 Markdown 比较复杂的一种表示。

| Table | Col1 | Col2 |
| ----- |:----:| ----:|
| Row1  | 1-1  | 1-2  |
| Row2  | 2-1  | 2-2  |
| Row3  | 3-1  | 3-2  |

上面第二行中的点代表对齐方式，分别是默认（居右）、居中、居左。

行内元素

9、超链接

Markdown 中有三种方式实现超链接。

//方式 1
[百度](http://www.baidu.com)

//方式 2
[百度][Baidu-url]
[Baidu-url]: http://www.baidu.com

方式 1 较为常用，也可以为链接的文字加上提示文字，只要在括号中超链接加上空格后添加提示内容即可。

[百度](http://www.baidu.com "这是提示文字")

方式 2 由链接文字和链接地址组成，不同的是两者均由 [] 包裹。链接地址的格式为：

方括号，里面输入链接地址；
紧接着是一个冒号；
冒号后面至少一个空格；
链接地址；
若有提示文字，空格后用引号或者括号包裹提示文字。

下面是完整示例：

[百度][Baidu-url]
[Baidu-url]: http://www.baidu.com "这是提示文字"

第三种方式是用 <> 来包裹 URL。

//方式 3
<http://www.baidu.com>

10、加粗和斜体

Markdown 使用 * 和 _ 来表示粗体和斜体。

//加粗
**这是加粗文字**
__这也是加粗文字__

//斜体
*这是斜体文字*
_这也是斜体文字_

被偶数个 * 或 _ 包裹的文字显示加粗效果，被奇数个包裹的为倾斜效果。

需要注意的是，* 和 - 要成对出现，不能混合使用，也不能只出现一个。同时，标识符号要与标识的文字紧挨着，符号与符号之间、符号文字之间不能有任何空格。

11、代码

使用 ` (撇号) 来包裹一小段代码。

`Hello world.`

若想在代码中添加撇号，可以使用多个撇号包裹里面需要添加的撇号，但注意里面的连续的撇号数量不能超过外面的数量。

//显示一个撇号
`` ` ``
//显示两个撇号
``` ``  ```

12、图片

图片的插入方式跟超链接前两种插入方式类似。

//方式 1
![](图片 url)

//方式 2
![如果图片不能显示，就显示这段文字][Image-url]
[Image-url]: 图片url "这是提示文字"

反斜杠 `\`

我们经常需要在文章中插入一些特殊符号，而这些符号恰好是前面所讲的标识符号，可以在特殊符号前插入 \ 来直接显示符号，而不让 Markdown 来将其解释为标识符号。

Markdown 支持以下这些符号前插入 \ 而显示其本来样子：

    \   反斜线
    `   反引号
    *   星号
    _   底线
    {}  花括号
    []  方括号
    ()  括弧
    #   井字号
    +   加号
    -   减号
    .   英文句点
    !   惊叹号

拓展

其实，市场上有很多的 Markdown 解释器，它们大都能支持上面所讲的语法，但呈现出的样式往往不一。另外，不同的解释器还能支持其他自己定义的语法，比如 Github 还能支持 emoji。下面再着重介绍 Github 支持的几个 Markdown 语法。不过需要注意的是，有些语法只能在 issue 或者 pull request 上使用，这个在后面讲每个语法时会标记（约定：“通用”表示在 Github 任何地方可以使用的语法，“特殊”表示只能在 issue 或者 pull request 上使用）。

语法高亮(通用)

上面说过，有的解释器是能够显示语法高亮的，Github 就可以。

任务列表（通用）

- [ ] task one
- [x] task two

用法跟普通列表的用法差不多，只不过在每一项文字前面加了 [ ] 或者 [x]。[ ] 中间有且只有一个空格，表示未完成，另一个表示已完成。

表格（通用）

Github 支持更简单的 table 语法。

First Header | Second Header
------------ | -------------
Content from cell 1 | Content from cell 2
Content in the first column | Content in the second column

表头与项用一排 - 分隔开，每一列用 | 分隔开。

SHA 引用（特殊）

每一次 commit 都会产生一个 id，用 @id 的方式可以链接到某个项目的特定的 commit。比如用 jquery/jquery@1b9575b9d14399e9426b9eacdd92b3717846c3f2 就能链接到 jquery 的一次 commit 记录上。

issue 引用（特殊）

用 #1 来引用当前 repo 的第一个 issue，也可以用 jquery/jquery#1 引用 jquery 的第一次 issue。

@（特殊）

用 @ 来提醒目标用户。比如 @CompileYouth 可以 @ 到我。

删除符号（通用）

用连续两个 ~ 包围的词会被加上删除符。比如 ~~This is removed~~。

Emoji（通用）

Github 比较有意思的是可以支持 emoji。比如 :smile: 表示笑脸等等，具体可以查看 Emoji Cheat Sheet

详细信息可以查看官方文档。最后 po 两张 Github 官方推荐的 Markdown Cheat Sheet：通用语法，Github 支持语法

工具

Windows 环境下，推荐 Typora、Markdownpad（自带图床功能）
Mac 环境下，推荐 Typora、Mou
笔记软件：为知笔记较好的支持 markdown，且支持 Windows、Mac、web、ios、android 等各个平台
当然，还有 Github

实践

Markdown 文件的编辑在不同编辑器中有不一样的表现，我主要介绍一下在 Atom 中使用 Markdown 的情况。

Atom 官方自带了一个插件，叫 markdown-preview，可以在 Atom 中进行预览。当然，Atom 还有很多第三方的 Markdown 插件，我使用的是 markdown-writer，可以使我更方便地编辑 Markdown 文件，当然你可以根据自己的需要下载插件。

在 Atom 中，其他的使用方式就不赘述了，唯一需要提一下的是插入 table。在 Markdown 中插入 table 是一件比较麻烦的事情，而在 Atom 中，可以简化操作，就是直接输入 table 然后按 Enter 键，编辑器便会自动生成 table 的模板，比自己手写便捷多了。

拓展阅读：

Markdown 语法说明

!!!转自：https://github.com/CompileYouth/front-end-study/blob/master/tool/markdown/Markdown-Learning.md