markdown缩进_轻松学透Markdown的终极教程 #5：GFM语法

GFM(GitHub Flavored Markdown)语法是除了标准的Markdown语法外最被广泛使用的另一种版本Markdown语法，它基于CommonMark。GFM语法与标准的Markdown语法大同小异，扩展了一些标准的Markdown语法没有的内容

5.1 GFM与标准的Markdown标记语法的异同

GFM语法与标准的Markdown标记语法大部分内容是相同的，这里以本系列教程前面讲过的「标准的Markdown标记语法」作为参考，给出GFM语法与标准Markdown语法的区别。

5.2 GFM语法增加的标记

需要在一款支持GFM语法的Markdown编辑器测试、使用GFM语法

下列语法是在ATOM + markdown-preview预览插件中运行显示的

5.2.1 删除线

在标准的Markdown中是不支持「删除线」效果的标记。

在GFM中，可以通过~~实现删除线的效果：

~~我是被删除的内容~~

效果显示：

「删除线」标记常可以用在内容的修订上面。

5.2.2 自动链接

在标准的Markdown中可以通过的标记实现「自动链接」的效果。

在GFM中，可以让「自动链接」变得更加简单：

远怀学堂的官方网站是：https://www.yuanhuaixuetang.com

效果显示：

在GFM中只要是合法的HTTP网址就可以自动被解析成一个有效的链接，可以省略标准Markdown中的尖括号(<>)

5.2.3 任务列表

任务列表、任务清单经常被我们用来记录待完成事项和已完成事项。

在标准的Markdown中是没有「任务列表」的标记语法的。

在GFM中，可以使用如下的语法实现「任务列表」：

- [ ] 待办事项1- [ ] 待办事项2- [x] 待办事项3- [ ] 待办事项4

显示效果：

这种语法需要注意是：用- [ ] 代表的是一个未勾选的复选框(未完成事项)，用- [x] 代表的是一个勾选的上的复选框(已完成事项)，方括号里是字母x。

5.2.4 表格

前面讲过在标准的Markdown语法中要实现表格的效果要使用「兼容的HTML」的方法，得使用html标记中的

。

在GFM中让使用表格变得简单些：

姓名 | 年龄 | 性别----|-----|----小明 | 18 | 男小刚 | 29 | 女李三 | 20 | 男

最终显示效果：

GFM语法中的「表格」标记通过|来对表格列项进行分隔，在第一行下面使用一个或多个减号(-)来指示第一行为表格的列表头。

有很多的表格插件，可以快速的插入「表格」标记语法(不需要手动去输入|、-号)，同时也可以对Markdown文档中「表格」标记语法进行格式上的调整，显得好看整齐一点。

关于在GFM中使用「表格」标记语法，我的建议是：

只有非常非常简单的表格可以考虑直接使用GFM中的「表格」标记语法，因为「表格」标记语法实现的表格效果样式很简单，也不容易定制样式，它所实现的表格算是非常简单入门的表格。

如果需要在文档中插入表格，可以先通过专业做图表类的软件做出格式精美的表格(图表)，然后再通过截图，将表格(图表)的图片「插入」在Markdown文档中。

还是那句话：专业的事交给专业的软件去做

5.2.5 代码块

在标准的Mqrkdown语法中可以对代码内容「缩进1个TAB制表符或者4个空格」实现代码的标记效果。

在GFM中增加了使用三个反引号(```)来标记一段代码块：

```function sum(a,b) {return a + b;}```

显示效果：

GFM使用三个反引号(```)包裹着代码块，这种语法比使用「缩进」标记代码的方法更加直观，好排版，推荐使用这种方法去标记代码块。

5.2.6 代码的语法高亮

在标准的Markdown语法中是不支持对代码块进行语法高亮显示的。

在GFM中使用三个反引号(```)的语法去标记一段代码块，同时可以指定这段代码块的编程语言，以实现对这段代码块的语法高亮显示：

```java public class HelloWorld {public static void main(String[] args){System.out.println("Hello,World");}}```

显示效果：

```javascriptfunction sum(a,b) {return a + b;}```

显示效果：

```html

我是html代码，测试语法高亮显示

```

显示效果：

```json{"web":"远怀学堂","url":"https://www.yuanhuaixuetang.com"}```

显示效果：

要实现代码块的语法高亮也很简单，只需要在开头的三个反引号(```)后面跟上这段代码的编程语言名称keyword即可。

代码块的语法高亮支持绝大多数的编程语言，在开头的三个反引号(```)后面可以使用的编程语言名称的keyword列表可以参考languages.yml这个链接里说明，一般为这个编程语言为人所熟知的名称，比如：java、php、javascript、html、css、ruby等等。

5.2.7 Emoji表情支持

在GFM语法中可以使用「Emoji表情」，这点在标准的Markdown中是不支持的，通过「Emoji表情」可以将Markdown文档做得更加丰富、生动：

:grinning::heart_eyes::speech_balloon::peach:

最终显示效果：

在GFM中使用「Emoji表情」的语法是:EMOJICODE:，EMOJICODE是由GFM语法中提供的，可以在Emoji Cheat Sheet或者emoji-cheat-sheet中查找到所有可用的「Emoji表情」和其对应的「EMOJICODE」。

【图 Emoji表情和对应的EMOJICODE部分示例】

我这里使用「Emoji表情」制作了一个简单的音乐播放器的效果：

 当前音乐：光辉岁月 - beyond ~ ⏪  ▶️  ⏩  ❤️    ➖  85 ➕  

小窍门：也可以直接选中复制Emoji Cheat Sheet或者emoji-cheat-sheet中提供的「Emoji表情」，然后直接粘贴到Markdown的编辑器中就可以使用对应的「Emoji表情」。

5.2.8 禁止了一些特殊的原生HTML标签

在标准的Markdown标记语法中是可以使用HTML语法去扩展Markdown的标记功能的，在GFM也是同样可以的，不过在GFM语法中会对一些特殊的HTML标签进行过滤，使这些特殊的HTML标签不生效：

GFM中会对这些特殊标签的左尖号(

GFM语法中禁用这些特殊的HTML标签对Markdown使用者没什么影响，我们也几乎不会用到这些特殊的HTML标签，我们也应该尽量少在Markdown中去使用其他的HTML标签。

GFM语法中禁用这些特殊标签的目的主要是这些特殊的标签可能会改变影响到HTML的最终解析和显示。

5.3 GFM语法减少或不支持的标记

5.3.1 单词内部的下划线(_)

下划线(_)在英语单词可以作为连字符之用，也经常出现在一些编程语言的变量命名中，例如：

user_nametask_in_processmy_order

下划线(_)在英文中有一定的特殊含义，在标准的Markdown中下划线(_)可以表示用来表示「强调」(斜体显示)，为了避免歧义在GFM语法中会忽略掉单词内部的下划线(_)，保持其原样输出：

【演示语法N】

我是一个_斜体_吗？_我是一个斜体吗？_

最终显示效果：

这是需要注意的是：GFM只是忽略解析单词内部的下划线(_)，但是在一个单词外面包裹的下划线(_)还是起到「强调」(斜体)的效果的。

在标准的Markdown中表示「强调」(斜体)的标记语法，也可以通过(*)号去实现，为了避免混淆，尽量不要去使用下划线(_)，尽量去使用(*)

5.4 GMF语法和标准的Markdown语法的选择

GFM标记语法更加的丰富一些，可标记性更强一点，很多Markdown编辑器都支持GFM标记语法的。

标准的Markdown标记语法更加的原生，标记简洁、精练，也足够满足绝大部分的应用场景的。

这两种标记语法，并非是二者只能选一，大家都应该对这两种标记语法有所了解和掌握，都是很简单的，同时学会了这两种标记语法之后，在不同的Markdown编辑器中可以根据该编辑器所支持的Markdown语法种类(GFM语法或标准的Markdown语法)，去使用不同的标记语法。

5.5 附录

GFM语法官方网站：

Mastering Markdown -- https://guides.github.com/features/mastering-markdown/

Basic writing and formatting syntax -- https://help.github.com/en/github/writing-on-github/basic-writing-and-formatting-syntax

GitHub Flavored Markdown Spec -- https://github.github.com/gfm/

查找「Emoji表情」的网站：

Emoji Cheat Sheet -- https://github.com/ikatyang/emoji-cheat-sheet/blob/master/README.md

emoji-cheat-sheet -- http://emoji-cheat-sheet.com/