【新人入门】Markdown——超级好用的笔记工具

一、Markdown 简介

  Markdown 是一种轻量级标记语言，创始人为约翰·格鲁伯（John Gruber）。 通过简单的标记语法，它可以使普通文本内容具有一定的格式，可以导出 PPT、HTML、Word、PDF、JPG 等多种格式的文档，文档后缀为 .md 或 .markdown。

  由于 Markdown 的轻量化、易读易写特性，并且对于图片，图表、数学式都有支持，许多网站都广泛使用 Markdown 来撰写帮助文档或是用于论坛上发表消息。 如 GitHub、Reddit、CSDN、简书等，甚至还能被使用来撰写电子书。

二、Markdown 工具

  Markdown 常用编写工具有 Typora (收费) 和 VSCode (免费) 等，由于一些众所众知的原因，本篇以 VSCode 为例

VSCode 相关插件：

Markdown All in One:载入 markdown 插件
Markdown Preview Enhanced:markdown 效果预览
Code Spell Checker:自动检测英文拼写
Paste Image:插入图片
mermaid:绘图工具

三、Markdown 基础语法

1、标题

• 一级标题 ==> 一个 # 号
• 二级标题 ==> 两个 # 号
• N 级标题 ==> N 个 # 号

六级标题：

# 一级标题
## 二级标题
### 三级标题
#### 四级标题
##### 五级标题
###### 六级标题

2、文本

• 斜体文本：编辑文本前后，输入【一个】星号 * 或下划线 _
• 粗体文本：编辑文本前后，输入【两个】星号 ** 或下划线 __
• 粗斜体文本：编辑文本前后，输入【三个】星号 *** 或下划线 ___

*斜体文本*
_斜体文本_

**粗体文本**
__粗体文本__

***粗斜体文本***
___粗斜体文本___

3、列表

• 无序列表：使用星号 * 、加号 + 或减号 - ，效果一致
• 有序列表：使用数字 1、2、3 等，并加上英文句号 .

* 无序列表 1
+ 无序列表 2
- 无序列表 3

1. 有序列表 1
2. 有序列表 2
3. 有序列表 3

• 控制层级：符号星号 * 、加号 + 或减号 - 前使用 tab

* 无序列表 1
+ 无序列表 2
	- 无序列表 2.1
	* 无序列表 2.2

4、链接/图片

• 原始链接：<链接地址>
• 文字链接：[链接名称] (链接地址)
• 图片链接：！[链接名称](链接地址 “title”)]

原始链接：<https://www.baidu.com>
文字链接：[百度搜索](https://www.baidu.com)
图片链接：![markdown](https://i-blog.csdnimg.cn/blog_migrate/f6baf3219476f714bd881f089c832ba9.png "markdown")

原始链接：https://www.baidu.com
文字链接：百度搜索
图片链接：

5、引用

• 一层引用：一个右尖括号 >
• 二层引用：两个右尖括号 >
• N 层引用：N 个右尖括号 >

> 一层引用
>> 二层引用
>>> 三层引用

一层引用

二层引用

三层引用

6、水平线

（1）分隔线

• 【三个以上】星 * 或减号 -

---
***
* * ****
- - - ----

---

---

---

---

（2）删除线

• 删除文字前后添加【两个】~

~~不幸被删除~~

不幸被删除

（3）下划线

• 下划线文字前后添加< u >< u />

<u>愉快的下划线</u>

愉快的下划线

7、表格

• 分隔列：使用竖线 |
• 分隔行：使用减号 -
• 对齐位置：冒号 : 位置决定对齐位置
  • 左对齐：:-
  • 右对齐：-:
  • 居中对齐：:-:

 左对齐 | 居中对齐 | 右对齐
 :- | :-: | -:
 1      |    2     |      3
 小左   |   居中   |   小右

左对齐	居中对齐	右对齐
1	2	3
小左	居中	小右

8、注脚

• 脚注：文本右上角备注
• 尾注：文末备注内容

脚注：文本[^注脚名字]
尾注：[^数字]:文本解释

百度搜索[^1]
[^1]: 我国著名的竞价广告商

百度[^2]
[^2]:https://www.baidu.com/

百度搜索¹

百度²

9、代码

• 行内代码：内容前后【一个】反引号 `

JS函数 `Promise()`

JS 函数 Promise()

• 块内代码：内容前后【三个】反引号 ```
  • 首行反引号后紧跟代码块语言，如```javascript

const numbers = [1, 1, 20, 3, 3, 3, 9, 9];
const uniqueNumbers = [...new Set(numbers)];

五、高级语法

1、目录

• 插入目录：输入 [TOC] (Table of Content) 即原地列出全部标题

2、HTML

• 支持原生 HTML 语法，内联样式书写

3、流程图和时序图

• Mermaid 是一种基于 JS 的绘图工具，使用mermaid作为代码块的语言标识
• 流程图

graph TD;
    A(爷爷)-->B(爸爸);
    A-->C(叔叔);
    B-->D(大郎);
    B-->E(二郎);

• 时序图

graph LR;
    A(爷爷)-->B(爸爸);
    A-->C(叔叔);
    B-->D(大郎);
    B-->E(二郎);

4、复选框

• todo-list ： - [x/X]和 - [ ]

- [x] 选中状态
- [ ] 未选中状态

• 选中状态
• 未选中状态

5、Markdown 数学公式

六、快捷键

加粗 Ctrl + B
斜体 Ctrl + I
引用 Ctrl + Q
插入链接 Ctrl + L
插入代码 Ctrl + K
插入图片 Ctrl + G
提升标题 Ctrl + H
有序列表 Ctrl + O
无序列表 Ctrl + U
横线 Ctrl + R
撤销 Ctrl + Z
重做 Ctrl + Y

---

1. 我国著名的竞价广告商 ↩︎

2. https://www.baidu.com/ ↩︎