Markdown的起源

Markdown最早诞生于2004年,美国科技博主约翰·格鲁伯(John Gruber)希望「**用一种易读易写的纯文本格式写作,并可将其转换为有效的 XHTML (或HTML)**」,于是在 2004 年 3 月 19 日推出初代 Markdown,而在主要语法上其实有很大一部分是由格鲁伯和亚伦·斯沃茨(Aaron Swartz)共同合作制定。

Markdown的特点

Markdown是一种轻量级的标记语言,完全由标点符号标签组成的纯文本。因此它并不复杂,通用的语法一共只有十多种,其目的是希望大家使用它撰写,并以纯文本形式原样发布,从而方便阅读、方便创作。其中,Markdown最重要的设计是可读性,也就是说这个语言可以直接在字面上的被阅读,而不用担心格式化指令标记的影响。

熟悉Markdown之后,写作效率能得到极大提升,而且它显然更适合阅读,不仅对于读者,对作者本人来说,也便于头脑清醒地进行持续的协作和修改。它的主要特点:

  1. 只需关注内容本身,无需操心样式,思路几乎不受影响,给写作带来极大便利
  2. 实时可视化展现,逻辑性更强,对作者和读者都有很大帮助
  3. 显示效果统一,协作效率高,无数软件都支持,并且直接用纯文本text方式打开也能浏览和修改
  4. 可内联 HTML 语法。Markdown 是一种创作格式,语法集合比较小,只是HTML标签的一小部分。但Markdown也可以直接使用 HTML标签,例如用 HTML 标签替代 Markdown 的链接语法。

Markdown语法手册

下述大部分效果展示来自Typora

斜体和粗体

  1. *斜体*或_斜体_

效果:斜体

  1. **粗体**

效果:粗体

  1. ***加粗斜体***

效果:**加粗斜体**

  1. ~~删除线~~

效果:删除线

分级标题

  1. 一级标题如下:
1
2
3
4
一级标题
========(经笔者试验,最少只需要两个就可以生效)
或者
# 一级标题
  1. 二级标题如下:
1
2
3
4
二级标题
--------(同上)
或者
## 二级标题
  1. 三级到六级标题:(通常只支持到6级标题)
1
2
3
4
### 三级标题
#### 四级标题
##### 五级标题
###### 六级标题

超链接

行内式

行内式的语法形式为:[]里写链接文字,()里写链接地址, ()中的""中可以为链接指定title属性,title属性可加可不加(title属性的效果是鼠标悬停在链接上会出现指定的 title文字)。具体为[链接文字](链接地址 "链接标题")这样的形式。注意链接地址与链接标题前有一个空格,例如:

1
hello [markdown](https://baike.baidu.com/item/markdown/3245829?fr=aladdin "markdown 百度百科")

参考式

参考式超链接一般用在学术论文上面,或者当某一个链接在文章中多处使用,那么使用引用的方式创建链接将非常好,它可以让你对链接进行统一的管理。

其语法形式为:参考式链接分为两部分,通常的写法为 [链接文字][链接标记],在文本的任意位置添加[链接标记]:链接地址 "链接标题",链接地址与链接标题前有一个空格。如果链接文字本身可以做为链接标记,你也可以写成[链接文字][] ,例如:

1
2
3
4
5
6
笔者常用的几个网站是[Google][1]、[Github][2]以及[掘金][3],其中[Google][1]的子网站一个不错的[翻译网站][]。

[1]:[https://google.com/] 'Google'
[2]:[https://github.com/] 'Github'
[3]:[https://juejin.cn/] '掘金'
[翻译网站]:[https://translate.google.cn/] 'Google翻译'

效果如下:

image-20230108154909883

自动链接

诸如网址或者email之类的链接使用<>包裹即可(在Typora中不使用<>也会显示出链接的效果),例如:

1
2
<http://example.com/>
<address@example.com>

效果如下:

image-20230108154926393

锚点

在网页中,锚点其实就是页面内超链接,用以跳转到页面内指定位置。类比到markdown中,就是跳转到文档中的指定位置,例如:

1
2
3
4
5
6
### 目标{#target}
或者以Html标签的形式(上面的方式笔者在本地Typora使用时跳转失败)
### 目标<a id="target" ></a>


跳转到[目标](#target)

列表

无序列表

无序列表可以使用星号*、加号+、减号-来表示。例如:

1
2
3
4
5
6
* item1
* item2
+ item3
+ item4
- item5
- item6

效果如下:

image-20230108154942929

有序列表

有序列表则使用数字接着一个英文句点。例如:

1
2
3
4
1. item1
2. item2
3. item3
4. item4

效果如下:

image-20230108154952674

任务列表

任务列表可以用来表示当前项是否完成,其语法形式为:- [ ] Write something here(注意中括号前和中间的空格),[ ]表示未完成,[x]表示已完成,例如:

1
2
3
- [ ] item1
- [x] item2
- [ ] item3

效果如下:

image-20230108155001757

引用

引用的语法形式为被引用的文本前加上>符号。例如:

1
> 文本的引用

效果如下:

image-20230108155151712

引用的多层嵌套

引用可以多层嵌套(也可以叫引用内的引用),只需要根据不同层次加上不同的>即可:

1
2
3
4
5
> > > 内层
> >
> > 中层
>
> 外层

效果如下:

image-20230108155201488

引用包含其他要素

引用的区块内也可以使用其他的 Markdown 语法,包括标题、列表等,例如:

1
2
3
4
5
> ### title
>
> 1. item1
> 2. item2
>

效果如下:

image-20230108160535615

图片

图片的创建方式与超链接相似,而且和超链接一样也有两种写法,行内式和参考式写法。语法中图片Alt的意思是如果图片因为某些原因不能显示,就用定义的图片Alt文字来代替图片。 图片Title则和链接中的Title一样,表示鼠标悬停与图片上时出现的文字。 Alt 和 Title 都不是必须的,可以省略,但建议写上。

行内式

行内式的语法形式为![图片Alt](图片地址 "图片Title"),例如:

1
![Baidu](https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png "百度一下,你就知道")

效果如下:

Baidu

参考式

插入图片的参考式和超链接一样,现在文档中要插入的地方写![图片Alt][标记],再在文档的最后写上[标记]:图片地址 "Title",例如:

1
2
3
4
![Baidu][baidu]


[baidu]:https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png "百度一下,你就知道"

注脚

在需要添加注脚的文字后加上脚注名字[^注脚名字],称为加注。 然后在文本的任意位置(一般在最后)添加脚注,脚注前必须有对应的脚注名字,例如:

经测试注脚与注脚之间必须空一行,不然会失效。成功后会发现,即使你没有把注脚写在文末,经Markdown转换后,也会自动归类到文章的最后。

1
2
3
4
5
6
7
使用 Markdown[^1]可以效率的书写文档, 直接转换成 HTML[^2], 你可以使用 Typora[^tp] 编辑器进行书写。

[^1]:Markdown是一种纯文本标记语言

[^2]:HyperText Markup Language 超文本标记语言

[^tp]:一款由 Abner Lee 开发的轻量级 Markdown 编辑器

效果如下:

image-20230108155249753

表格

表格有的语法形式比较简洁:

  1. 第一行为表头,第二行分隔表头和主体部分,第三行开始每一行为一个表格行
  2. 列与列之间用管道符|隔开,表格每一行的两边的管道符可以选择不加
  3. 第二行还可以为不同的列指定对齐方向,默认为左对齐,在-右边加上:就右对齐,左右两边都加上就是居中。

您可以使用表格的HTML字符代码(|)在表中显示管道(|)字符。

例子如下:

1
2
3
4
5
学号 | 姓名 | 分数 
---- | ----:| :---:
张三 | 男 | 60
李四 | 女 | 60
王五 | 男 | 60

效果如下:

image-20230108155301455

分割线

分割线的语法形式为:一行中使用三个及以上的星号*,减号-,下划线_来生成一个分割线,行内不能有其他内容,在符号之间插入空格没有影响。例如:

1
2
3
4
5
* * *

---

___

效果如下:

image-20230108155523370

代码

对于程序员来说,这个语法可能是必不可少的。语法形式为:

  1. 行内代码,插入一个单词或者一小段代码的时候,用反引号```将代码包裹,例如:
1
每个语言的第一课,可能都是输出`hello world`了。

如果要表示为代码的单词或短语包含一个或多个反引号,可以通过将单词或短语括在双反引号(````)中来对其进行转义。

效果如下:

image-20230108155314653

  1. 多行代码,在代码块的上下两行分别加上来包裹,在上面的后写上代码块的所属语言,就会显示对应的高亮,例如:
1
2
3
4
5
```java
public static void main(String[] args) {
System.out.println("hello world!").
}
```

效果如下:

image-20230108155322107

转义

可以使用反斜杠\转义以下字符,来避免歧义。

字符 名称
\ 反斜杠
` 反引号
* 星号
_ 下划线
{} 大括号
[] 中括号
() 括号
# 井号
+ 加号
- 减号(连字符)
.
! 感叹号
| 管道

扩展

HTML代码块

Markdown 兼容 HTML 原始码,只需要按照HTML的语法编写正确,剩下的 Markdown 都会帮你处理,例如表格还可以表示为:

1
2
3
4
5
6
7
8
9
10
11
12
13
<table>
<tr>
<th rowspan="2">值班人员</th>
<th>星期一</th>
<th>星期二</th>
<th>星期三</th>
</tr>
<tr>
<td>张三</td>
<td>李四</td>
<td>王五</td>
</tr>
</table>

效果如下:

image-20230108155337211

Markdown对于HTML良好的支持性成为它良好的扩展,使得我们编写的文档具有更多可能性以及灵活性。

Emoji图标

Typora中还支持使用简短的代码来展示Emoji图标,例如:

1
:smile:

效果如下:

image-20230108155344746

详细的列表可以参照Markdown实用小技巧: 个个用着都很爽_琦彦的博客-CSDN博客_markdown使用技巧中的列表。

参考