编程语言markdown

html, markdown

2019-10-12

Source

Edit

History

markdown笔记

文章目录

[TOC]

因为平时经常用markdown写文章，所以记录一下，免得忘了语法还要百度。

markdown语法

斜体和粗体

代码：

*斜体*或_斜体_
**粗体**
***加粗斜体***
~~删除线~~

显示效果：

斜体或_斜体_
粗体
加粗斜体
~~删除线~~

分级标题

第一种写法：

这是一个一级标题
============================
这是一个二级标题
--------------------------------------------------

第二种写法：

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

输入[TOC]后会把所有的标题写到目录大纲中

超链接

Markdown 支持两种形式的链接语法：行内式和参考式两种形式，行内式一般使用较多

行内式

语法说明：

[]里写链接文字，()里写链接地址, ()中的”“中可以为链接指定title属性，title属性可加可不加。title属性的效果是鼠标悬停在链接上会出现指定的 title文字。链接文字’这样的形式。链接地址与链接标题前有一个空格。

代码：

1 2	欢迎来到[雁陎的自耕地](https://yanshu.live) 欢迎来到[雁陎的自耕地](https://yanshu.live "雁陎的自耕地")

显示效果：

欢迎来到雁陎的自耕地

参考式

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

语法说明：

参考式链接分为两部分，文中的写法 [链接文字][链接标记]，在文本的任意位置添加[链接标记]:链接地址 “链接标题”，链接地址与链接标题前有一个空格。

如果链接文字本身可以做为链接标记，你也可以写成[链接文字][]的形式，然后添加[链接文字]：链接地址的形式，见代码的最后一行。

代码：

我经常打开的几个网站[博客][1]、[图床][2]以及[工具][3]
[博客][2]是一个不错的[网站][]。

[1]:https://yanshu.live "雁陎的自耕地"
[2]:https://hd.image.yanshu.live "图床"
[3]:https://tools.yanshu.live "工具"
[网站]:ttps://yanshu.live "雁陎的自耕地"

显示效果：

我经常打开的几个网站博客、图床以及工具博客是一个不错的网站。

自动链接

语法说明：

Markdown 支持以比较简短的自动链接形式来处理网址和电子邮件信箱，只要是用<>包起来， Markdown 就会自动把它转成链接。一般网址的链接文字就和链接地址一样，例如：

代码：

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

显示效果：

http://example.com/

address@example.com

锚点

由于hexo不支持锚点语法，所以请自行百度

网页中，锚点其实就是页内超链接，也就是链接本文档内部的某些元素，实现当前页面中的跳转。比如我这里写下一个锚点，点击回到目录，就能跳转到目录。在目录中点击这一节，就能跳过来。还有下一节的注脚。这些根本上都是用锚点来实现的。

语法描述：

在你准备跳转到的指定标题后插入锚点，然后在文档的其它地方写上连接到锚点的链接。

代码：

1 2	# markdown语法跳转到[目录](#index)

显示效果：

跳转到markdown语法

记得标题后要加上空格！

列表

无序列表

使用 *，+，- 表示无序列表，记得和上一行文字空一行！

代码

1
2
3

* 无序列表项 一
* 无序列表项 二
* 无序列表项 三

显示效果

无序列表项一
无序列表项二
无序列表项三

有序列表

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

代码：

1
2
3

1. 有序列表项 一
2. 有序列表项 二
3. 有序列表项 三

显示效果：

有序列表项一
有序列表项二
有序列表项三

定义型列表

语法说明：

定义型列表由名词和解释组成。一行写上定义，紧跟一行写上解释。解释的写法:紧跟一个缩进(Tab)

代码

Markdown
:    轻量级文本标记语言，可以转换成html，pdf等格式（左侧有一个可见的冒号和四个不可见的空格）

代码块 2
:  这是代码块的定义（左侧有一个可见的冒号和四个不可见的空格）

        代码块（左侧有八个不可见的空格）

显示效果

Markdown

轻量级文本标记语言，可以转换成html，pdf等格式

代码块 2

这是代码块的定义

代码块（左侧有八个不可见的空格）

列表缩进

语法说明：

列表项目标记通常是放在最左边，但是其实也可以缩进，最多 3 个空格，项目标记后面则一定要接着至少一个空格或制表符。

要让列表看起来更漂亮，你可以把内容用固定的缩进整理好（显示效果与代码一致）：

轻轻的我走了，正如我轻轻的来；
我轻轻的招手，作别西天的云彩。

那河畔的金柳，是夕阳中的新娘；波光里的艳影，在我的心头荡漾。
软泥上的青荇，油油的在水底招摇；在康河的柔波里，我甘心做一条水草！
那榆荫下的一潭，不是清泉，是天上虹；揉碎在浮藻间，沉淀着彩虹似的梦。

寻梦？撑一支长篙，向青草更青处漫溯；满载一船星辉，在星辉斑斓里放歌。

但我不能放歌，悄悄是别离的笙箫；夏虫也为我沉默，沉默是今晚的康桥！

悄悄的我走了，正如我悄悄的来；我挥一挥衣袖，不带走一片云彩。

包含段落的列表

语法说明：

列表项目可以包含多个段落，每个项目下的段落都必须缩进 4 个空格或是 1 个制表符（显示效果与代码一致）：

轻轻的我走了，正如我轻轻的来；我轻轻的招手，作别西天的云彩。那河畔的金柳，是夕阳中的新娘；波光里的艳影，在我的心头荡漾。软泥上的青荇，油油的在水底招摇；在康河的柔波里，我甘心做一条水草！

那榆荫下的一潭，不是清泉，是天上虹；揉碎在浮藻间，沉淀着彩虹似的梦。寻梦？撑一支长篙，向青草更青处漫溯；满载一船星辉，在星辉斑斓里放歌。但我不能放歌，悄悄是别离的笙箫；夏虫也为我沉默，沉默是今晚的康桥！
悄悄的我走了，正如我悄悄的来；我挥一挥衣袖，不带走一片云彩。

包含引用的列表

语法说明：

如果要在列表项目内放进引用，那 > 就需要缩进：

代码：

1
2
3

*  阅读的方法:
    > 打开书本。
    > 打开电灯。

显示效果

阅读的方法:

打开书本。

打开电灯。

包含代码区块的引用

如果要放代码区块的话，该区块就需要缩进两次，也就是 8 个空格或是 2 个制表符：

引用

语法说明：

引用需要在整个段落的第一行最前面加上>。

代码：

> 这是一个有两段文字的引用,
无意义的占行文字1.
无意义的占行文字2.

> 无意义的占行文字3.
无意义的占行文字4.

显示效果：

这是一个有两段文字的引用, 无意义的占行文字1. 无意义的占行文字2.

无意义的占行文字3. 无意义的占行文字4.

引用的多层嵌套

区块引用可以嵌套（例如：引用内的引用），只要根据层次加上不同数量的 > ：

代码：

>>> 请问 Markdwon 怎么用？ - 小白

>> 自己看教程！ - 愤青

> 教程在哪？ - 小白

显示效果：

请问 Markdwon 怎么用？ - 小白

自己看教程！ - 愤青

教程在哪？ - 小白

引用其他要素

引用的区块内也可以使用其他的 Markdown 语法，包括标题、列表、代码区块等

插入图像

图片的创建方式与超链接相似，而且和超链接一样也有两种写法，行内式和参考式写法。

语法中图片Alt的意思是如果图片因为某些原因不能显示，就用定义的图片Alt文字来代替图片。图片Title则和链接中的Title一样，表示鼠标悬停与图片上时出现的文字。 Alt 和 Title 都不是必须的，可以省略，但建议写上。

行内式

语法说明：![图片Alt](图片地址 “图片Title”)

代码：

1	![夜与萤火虫](https://ws3.sinaimg.cn/large/007GwGf6ly1g1on018v5fj31hc0xcgv4.jpg)

显示效果：

参考式

语法说明：

在文档要插入图片的地方写[图片Alt][标记]

在文档的最后写上[标记]:图片地址 “Title”

代码：

1
2
3

![夜与萤火虫][night]

[night]: https://ws3.sinaimg.cn/large/007GwGf6ly1g1on018v5fj31hc0xcgv4.jpg '夜与萤火虫'

注脚

语法说明：

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

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

代码：

使用 Markdown[^1]可以效率的书写文档, 直接转换成 HTML[^2], 你可以使用 vnote[^Le] 编辑器进行书写。

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

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

[^Le]: 开源笔记平台，支持Markdown和笔记直接发为博文

显示效果：

使用 Markdown¹可以效率的书写文档, 直接转换成 HTML², 你可以使用 vnote³ 编辑器进行书写。

折叠

展开查看

链接测试
import math

注意里面不能使用md语法了，只能用html嵌套

各种图形

流程图

markdown语法的流程图主要由三部分组成：流程图块定义、流程图符号声明和流程处理，该代码要在flow代码块中输入

流程图的语法：

st=>start:开始 #定义流程图的开始,注意冒号后要空一格
op1=>operation: My operation #定义一个长方形的流程框
c=>condition:Yes or No? #定义一个判断
e=>end:结束 #定义流程结束

st->op1->c  #从开始到长方形再到判断
c(yes)->e #判断为真时执行分支
c(no)->op1 #判断为假时执行分支

显示效果：

st=>start: 开始
op1=>operation: My operation
c=>condition: Yes or No?
e=>end: 结束

st->op1->c
c(yes)->e
c(no)->op1

说明：operation、subroutine和inputoutput分别对应的是长方形、子程序和四边形

可以在流程图符号后加上需要跳转的链接。例如：

st=>start:开始:>www.google.com

也可通过(right,left,top,bottom)这四个方向在流程图处理的时候来调整流程的方式，比如下面语法：

st=>start: 开始: >www.google.com
op1=>operation: My operation
c=>condition: Yes or No?
e=>end: 结束

st(right)->op1(right)->c
c(yes,right)->e
c(no,top)->op1

todo list

代码：

1
2
3

- [] 未处理的事情1
- [] 未处理的事情2
- [x] 已处理的事情

显示效果：

[] 未处理的事情1
[] 未处理的事情2
已处理的事情

序列图

代码：

1
2
3

Alice->Bob: Hello Bob, how are you?
Note right of Bob: Bob thinks
Bob-->Alice: I am good thanks!

1
2
3

Alice->Bob: Hello Bob, how are you?
Note right of Bob: Bob thinks
Bob-->Alice: I am good thanks!

符号	含义
-	实线
>	实心箭头
--	虚线
>>	空心箭头

甘特图（这里无法显示）

title 项目开发流程
section 项目确定
    需求分析      :a1, 2016-06-22, 3d
    可行性报告    :after a1, 5d
    概念验证      : 5d
section 项目实施
    概要设计      :2016-07-05  , 5d
    详细设计      :2016-07-08, 10d
    编码          :2016-07-15, 10d
    测试          :2016-07-22, 5d
section 发布验收
    发布: 2d
    验收: 3d

表格

语法说明：

不管是哪种方式，第一行为表头，第二行分隔表头和主体部分，第三行开始每一行为一个表格行。

列于列之间用管道符|隔开。原生方式的表格每一行的两边也要有管道符。

第二行还可以为不同的列指定对齐方向。默认为左对齐，在-右边加上:就右对齐。

代码：

学号|姓名|分数
-|-|-
小明|男|75
小红|女|79
小陆|男|92

为表格第二列指明方向：

姓名|年龄
-|-:
小明|15岁
小红|14岁

显示效果：

学号	姓名	分数
小明	男	75
小红	女	79
小陆	男	92

姓名	年龄
小明	15岁
小红	14岁

表格内换行

原生markdown并无换行功能，只能用html替代，加入,<br>

产品	价格
阿里云香港	24元/月 288元/年
阿里云学生	10元/月 120元/年

合并单元格

原生markdown无此功能，但同样可以通过html实现

如：

<table>
<tr>
    <td rowspan='2' colspan='2'></td>
    <td colspan='2'>变化程度</td>
</tr>
<tr>
    <td>静态</td>
    <td>动态</td>
</tr>
<tr>
    <td rowspan='2'>复杂程度</td>
    <td>简单</td>
    <td>静态可预期<br>
    产品和服务少</td>
    <td>静态不可预期<br>
    产品和服务少</td>
</tr>
<tr>
    <td>复杂</td>
    <td>静态且不可预见环境</td>
    <td>动态且不可预见环境</td>
</tr>
</table>

表格由 <table> 标签来定义。每个表格均有若干行（由 <tr>标签定义），每行被分割为若干单元格（由 <td>标签定义）。字母 td 指表格数据（table data），即数据单元格的内容。
rowspan：规定单元格可横跨的行数。横跨几行属性值就写几，如上图中横跨7行，则rowspan=”7"
colspan：规定单元格可纵深的列数。

可用http://www.tablesgenerator.com/实现表格转html代码功能，再用span属性

实现效果：

		变化程度
		静态	动态
复杂程度	简单	静态可预期产品和服务少	静态不可预期产品和服务少
复杂程度	复杂	静态且不可预见环境	动态且不可预见环境

分割线

你可以在一行中用三个以上的星号、减号、底线来建立一个分隔线，行内不能有其他东西。你也可以在星号或是减号中间插入空格。下面每种写法都可以建立分隔线：

代码：

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

显示效果：

代码

利用"`"符号（一般在ESC键下方）包裹代码，上下各三个，在上方`后加上程序名可转为相应格式，如加上python。

行内加上代码只需左右各一个`就行

公式

参见Latex语法

Markdown是一种纯文本标记语言↩︎
HyperText Markup Language 超文本标记语言↩︎
开源笔记平台，支持Markdown和笔记直接发为博文↩︎