Markdown 入门及语法详细指南 ★

Posted 墨蓝天上

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了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. 平台集成

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 格式语法将不会被处理。

快捷键

功能快捷键参考(因各编辑器差异,具体键位视实际使用的编辑器设置为准)
标题Ctrl+1…6
加粗Ctrl+B
斜体Ctrl+I
有序列表Ctrl+O
无序列表Ctrl+U
任务列表Ctrl+C
引用Ctrl+Q
插入代码Ctrl+K
插入链接Ctrl+L
插入图片Ctrl+G
分割线Ctrl+R

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
12
12

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) 替代。

示例:上标和下标

210,H2O


使用 HTML 标签

210,H2O

9.2 图表(扩展语法)

转义字符

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 已有了解的高玩提供更多帮助 😆 。文中如有疏漏还请大佬指出改正,后续会继续补充完善哒。

以上是关于Markdown 入门及语法详细指南 ★的主要内容,如果未能解决你的问题,请参考以下文章

Markdown——入门指南

markdown 打字稿...编码说明,提示,作弊,指南,代码片段和教程文章

Markdown——入门指南

Android:Kotlin详细入门学习指南-函数-基础语法

Android:Kotlin详细入门学习指南-高阶函数-基础语法

Android:Kotlin详细入门学习指南-高阶函数-基础语法