Markdown 语法

目录

在文章开头或段落中填写[TOC]以显示全文的目录。如果不需要在目录中显示某一个标题,在标题后面添加 {ignore=true} 即可。比如## 这是二级标题 {ignore=true},注意中间有一个空格。
使用[TOC]显示目录,选择目录标题深度有两种方式:

1
2
3
4
5
6
---
toc:
depth_from: 2
depth_to: 3
ordered: false
---
1
@import "[TOC]" {cmd="toc" depthFrom=2 depthTo=2 orderedList=false} 

标题

# 这是一级标题
## 这是二级标题
###### 这是六级标题

文字

这是倾斜的文字_这是倾斜的文字_
这是加粗的文字__这是加粗的文字__
这是斜体加粗的文字___这是斜体加粗的文字___

这是倾斜的文字*这是倾斜的文字*
这是加粗的文字**这是加粗的文字**
这是斜体加粗的文字***这是斜体加粗的文字***

这是加删除线的文字~~这是加删除线的文字~~

文字下划线。使用HTML u标签<u>文字下划线。使用HTML u标签</u>

{++ 文字下划线 ++}{++ 文字下划线 ++}

文字高亮 ex an ==文字高亮== 上^标^ e^x^ 下~标~ a~n~

显示按键风格文字Enter 按键 <kbd>Enter</kbd> <kbd>按键</kbd>

标记文字
换行
换行

1
2
<mark>标记文字</mark>
换行<br>换行
设置居中。
1
<div align=center>设置居中。</div>

我是黑体字 我是宋体字 我是微软雅黑 我是华文彩云

1
2
<font face="微软雅黑">我是微软雅黑</font>
<font face="STCAIYUN">我是华文彩云</font>

size为1
size为4

1
size为4:<font size="4">size为4</font>

红色文字 浅红色文字 蓝色文字 浅蓝色文字 绿色文字 金黄色文字 浅黄色文字 深黄色文字

1
2
<font color="#dd0000">浅红色文字</font> 
<font color="blue">蓝色文字</font>

我是黑体,绿色,尺寸为5

1
<font face="黑体"  size=5 color=green>我是黑体,绿色,尺寸为5</font>
背景色的设置是按照十六进制颜色值:#FFFF00
背景色的设置是按照十六进制颜色值:#D1EEEE
背景色的设置是按照十六进制颜色值:#C0FF3E
背景色的设置是按照十六进制颜色值:#54FF9F
背景色是orange
1
<table><tr><td bgcolor=orange>背景色是orange</td></tr></table>

注释

注释不会被渲染出来,按下快捷键 Ctrl+/将当前行或选中的段落注释与反注释。
<!-- 你看不见我 -->
<!-- 多行注释
就像这样 -->

在首页显示文章的部分内容,在文章中使用<!-- more -->手动截断,除了可以精确控制需要显示的内容以外,也可以让Hexo的插件更好的识别。

分割线

有3种方式:--- *** ___


列表

使用- * +三种符号都可以新建列表。注意:- + *符号与内容之间都要有一个空格。

  • 列表内容
    • 列表内容
      • 列表内容
      • 列表内容
        • 列表内容
1
2
3
4
5
- 列表内容
- 列表内容
* 列表内容
- 列表内容
+ 列表内容

使用数字新建列表。

  1. 列表内容
    1. 列表内容
      1. 列表内容
    2. 列表内容
      1. 列表内容
  2. 列表内容
1
2
3
4
5
6
1. 列表内容
1. 列表内容
1. 列表内容
2. 列表内容
1. 列表内容
2. 列表内容
  • [x] 已完成事项
    • [ ] 未完成
    • [ ] 未完成
  • [ ] 未完成
  • [ ] 在github中不能正确显示。
1
2
3
4
5
- [x] 已完成事项
- [ ] 未完成
- [ ] 未完成
- [ ] 未完成
- [ ] 在github中不能正确显示。

表格

表头 表头 表头 表头
内容 内容 内容 内容
^ 内容 > 内容
内容 > 内容 内容
1
2
3
4
5
| 表头 | 表头  | 表头 | 表头  |
| ---- | :---: | ---: | :---: |
| 内容 | 内容 | 内容 | 内容 |
| ^ | 内容 | > | 内容 |
| 内容 | > | 内容 | 内容 |
  1. 第二行分割表头和内容。
  2. ^>分别表示上下合并和左右合并。在github中不能正确显示。
  3. -有一个就行,为了对齐,多加了几个。
  4. 文字默认居左。 -两边加:表示文字居中 -右边加:表示文字居右

段落

这是段落的内容

  • 这是段落的内容
  • 这是段落的内容

这是段落的内容

1
2
3
4
5
> 这是段落的内容
> 这是段落的内容
>* 这是段落的内容
>> - 这是段落的内容
>>> 这是段落的内容

段落边框

github不支持此功能
!!! note
This is the

!!! summary
This is the

!!! info
This is the

!!! tip
This is the

!!! success
This is the

!!! question
This is the

!!! warning
This is the

!!! failure
This is the

!!! danger
This is the

!!! example
This is the

!!! quote
This is the

!!! note
This is the note admonition body

!!! danger Danger
    This is the **danger**

!!! note 使用方法,选择样式,在后面直接写文字
使用方法,选择样式,在后面直接写文字

!!! danger “”
直接写文字

引用

使用@import可以引用多种格式的本地或网络文件。

1
2
3
@import "1.txt" {class="line-numbers"}
@import "1.py"
@import "C:/Users/1.jpg"

github可能不支持{class=“line-numbers”}

超链接

图片超链接

![图片名称](图片地址 '图片简介')
图片名称可以用来做记录,方便搜索查看,可填可不填。
图片地址可以是图片本地地址,也可以是网络图片链接。
图片简介是当鼠标悬停在图片上时显示的内容。如果不想显示图片下方简介,用空格代替,即" ",或者不填写图片简介。

在markdown里写不写图片名称都不会显示名称。而在网页制作中使用markdown,如果填写了图片名称而没填写图片简介,图片名称却会显示在图片下面。所以如果不想在图片下显示文字,名称和简介都不填写。

qwer
![qwer](https://i.loli.net/2021/10/20/fryZVW1xP2qtAsI.jpg "qwer")

另一种插图方式,自定义图片大小。
<img src="url" width="" height="" title="" />

1
<img src="https://i.loli.net/2021/10/20/fryZVW1xP2qtAsI.jpg" width="" height="" title="qwer" />

网址或文件超链接

[超链接名](超链接地址 "超链接简介")
超链接名是显示在文中的文字。
超链接地址可以是本地文件地址,也可以是网络链接。
超链接简介是当鼠标悬停在链接上时显示的内容,可填可不填。
百度
百度
链接到本地文件

1
2
3
*[百度](https://baidu.com "百度")*
**[百度](https://baidu.com)**
[链接到本地文件](1.txt)

另一种链接方式:百度

1
<a href="https://baidu.com" title="baidu" target="_blank">百度</a>

href是链接。title为链接添加标题,当鼠标悬停在链接上时,将显示提示,title可加可不加。

图片链接至网站

综合图片超链接与网址超链接,示例为图片添加超链接,点击图片就能打开所链接的网址。

1
[![](https://i.loli.net/2021/10/20/fryZVW1xP2qtAsI.jpg 'qwer')](https://www.baidu.com/)

链接变量的定义与引用

定义链接:[baidu]: <https://baidu.com> "baidu"
引用链接:[百度链接][baidu]
效果:百度链接

这种写法可以将多个链接地址与简介一起写在文中其它地方,而且可以多处共用一个链接。注意正文与链接之间空一行。
共用链接baidu,新的链接

1
2
3
4
[共用链接baidu][baidu],新的[链接][2]。

[baidu]: <https://baidu.com> "baidu"
[2]: <https://baidu.com> "baidu"

标题超链接

[标题指定 ID](#heading-ids)
在标题后面输入空格,添加一个超链接标记,在文中其它地方使用超链接标记,可以链接到此处。例如:
先在标题后添加标记,### 引用 {#ids-1}
然后链接到引用[链接到引用](#ids-1)
注意:自定义链接标记时,要有一个#
PS:使用这种链接方式就不能上传到github,只能在本地使用。

链接到本地其它文件里,先在要链接的文件里的某个标题后添加超链接标记。
例如:链接到本地文件文章编辑.md里的某个标题### 段落缩进,先在此处添加标记### 段落缩进 {#ids-2}
链接到其它文件[链接到其它文件](文章编辑.md#ids-2)

锚点(Anchors)

格式:[锚点文本](#锚点链接)。可以代替标题超链接。需要注意如下几点:
欲定位的锚点链接必须是标题,即#、###等定义的6级标题;
锚点链接前只写一个#
不管标题大小写,锚点均为小写;
可以使用中文做锚点,中文锚点需要省略() 等中文标点符号。

以标题### 锚点(Anchors)为锚点:例一锚点(Anchors)
[例一锚点(Anchors)](#锚点anchors)
以标题### 超链接为锚点:例二锚点
[例二锚点](#超链接)

注解

文章最下面显示注解

在这是一个注解[1],注解内容会显示在文章的最下面[2]

1
2
3
这是一个注解[^1],注解内容会显示在文章的最下面[^2]。
[^1]: 第一个注解
[^2]: 第二个注解

在文字上方显示注解

The HTML specification
is maintained by the W3C.

1
2
3
4
*[HTML]: Hyper Text Markup Language
*[W3C]: World Wide Web Consortium
The HTML specification
is maintained by the W3C.

词语解释

在github中没有markdown的效果好。

Apple
Pomaceous fruit of plants of the genus Malus in the family Rosaceae.
苹果
一种水果。
1
2
3
4
5
Apple
: Pomaceous fruit of plants of the genus Malus in the family Rosaceae.

苹果
: 一种水果。

文字颜色

GreenYellow\textcolor{GreenYellow}{GreenYellow}
Yellow\textcolor{Yellow}{Yellow}
Goldenrod\textcolor{Goldenrod}{Goldenrod}
Orange\textcolor{Orange}{Orange}
Maroon\textcolor{Maroon}{Maroon}
Red\textcolor{Red}{Red}
OrangeRed\textcolor{OrangeRed}{OrangeRed}
Salmon\textcolor{Salmon}{Salmon}
Magenta\textcolor{Magenta}{Magenta}
Fuchsia\textcolor{Fuchsia}{Fuchsia}
Lavender\textcolor{Lavender}{Lavender}
Thistle\textcolor{Thistle}{Thistle}
Orchid\textcolor{Orchid}{Orchid}
DarkOrchid\textcolor{DarkOrchid}{DarkOrchid}
Purple\textcolor{Purple}{Purple}
Plum\textcolor{Plum}{Plum}
Violet\textcolor{Violet}{Violet}
BlueViolet\textcolor{BlueViolet}{BlueViolet}
CadetBlue\textcolor{CadetBlue}{CadetBlue}
CornflowerBlue\textcolor{CornflowerBlue}{CornflowerBlue}
MidnightBlue\textcolor{MidnightBlue}{MidnightBlue}
RoyalBlue\textcolor{RoyalBlue}{RoyalBlue}
Blue\textcolor{Blue}{Blue}
Cyan\textcolor{Cyan}{Cyan}
SkyBlue\textcolor{SkyBlue}{SkyBlue}
Turquoise\textcolor{Turquoise}{Turquoise}
Aquamarine\textcolor{Aquamarine}{Aquamarine}
SeaGreen\textcolor{SeaGreen}{SeaGreen}
Green\textcolor{Green}{Green}
ForestGreen\textcolor{ForestGreen}{ForestGreen}
LimeGreen\textcolor{LimeGreen}{LimeGreen}
YellowGreen\textcolor{YellowGreen}{YellowGreen}
SpringGreen\textcolor{SpringGreen}{SpringGreen}
Brown\textcolor{Brown}{Brown}
Tan\textcolor{Tan}{Tan}
Gray\textcolor{Gray}{Gray}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
$\textcolor{GreenYellow}{GreenYellow}$
$\textcolor{Yellow}{Yellow}$
$\textcolor{Goldenrod}{Goldenrod}$
$\textcolor{Orange}{Orange}$
$\textcolor{Maroon}{Maroon}$
$\textcolor{Red}{Red}$
$\textcolor{OrangeRed}{OrangeRed}$
$\textcolor{Salmon}{Salmon}$
$\textcolor{Magenta}{Magenta}$
$\textcolor{Fuchsia}{Fuchsia}$
$\textcolor{Lavender}{Lavender}$
$\textcolor{Thistle}{Thistle}$
$\textcolor{Orchid}{Orchid}$
$\textcolor{DarkOrchid}{DarkOrchid}$
$\textcolor{Purple}{Purple}$
$\textcolor{Plum}{Plum}$
$\textcolor{Violet}{Violet}$
$\textcolor{BlueViolet}{BlueViolet}$
$\textcolor{CadetBlue}{CadetBlue}$
$\textcolor{CornflowerBlue}{CornflowerBlue}$
$\textcolor{MidnightBlue}{MidnightBlue}$
$\textcolor{RoyalBlue}{RoyalBlue}$
$\textcolor{Blue}{Blue}$
$\textcolor{Cyan}{Cyan}$
$\textcolor{SkyBlue}{SkyBlue}$
$\textcolor{Turquoise}{Turquoise}$
$\textcolor{Aquamarine}{Aquamarine}$
$\textcolor{SeaGreen}{SeaGreen}$
$\textcolor{Green}{Green}$
$\textcolor{ForestGreen}{ForestGreen}$
$\textcolor{LimeGreen}{LimeGreen}$
$\textcolor{YellowGreen}{YellowGreen}$
$\textcolor{SpringGreen}{SpringGreen}$
$\textcolor{Brown}{Brown}$
$\textcolor{Tan}{Tan}$
$\textcolor{Gray}{Gray}$

小图标emoji

🔴🟠🟡🟢🔵🟣🟤⚫⚪✅☑️✔️❌❎⭕🙏👤👥🚶🏃💪👈👉☝👆👇✌✋👌👍👎✊👊👋👏👐✍🔃🔄🔙🔚🔛🔜🔝👣🐾👀👓👑🎓💍🌂📶📳📴♻🏧🚮🚰♿🚹🚺🚻🚼🚾⚠🚸⛔🚫🚳🚭🚯🚱🚷🔞🐁🐂🐅🐇🐉🐍🐎🐐🐒🐓🐕🐖🐼🐻🐨🐔🦆🦢🕊🦜🦉🐣🐤🐥🐦🐧🐸🐊🐢🐲🐳🐋🐬🐟🐠🐡🐙🐌🐛🐜🐝🐞🦋💐🌸💮🌹🌺🌻🌼🌷🌱🌲🌳🌴🌵🌾🌿🍀🍁🍂🍃🥝🥭🥥🍇🍈🍉🍊🍋🍌🍍🍎🍏🍐🍑🍒🍓🍅🍆🌽🍄🌰🍔🍟🍕🍳🍘🍙🍚🍛🍜🍩🍪🎂🍰🍫🍬🍭🍼🍷🍸🍹🍴⬆↗➡↘⬇↙⬅↖↕↔↩↪⤴⤵🌍🌎🌏🌐🌑🌒🌓🌔🌕🌖🌗🌘🌚🌙🌛🌜🌝🌞☀⭐🌟🌠⛅☔⚡❄🔥💧🌊🎨🏆⚽⚾🏀🏈🎾🎱🎳⛳🏊🚴🚵🎯🎮🎷🎸🎺🎻🎬💀☠👻👽💣🌋🗻🏠🏡🏯🗼🎠🚁🚀💌💎💈⌛⏳⌚⏰🎈🎉🎊🎐🎀🎁📯📻💡🔦🔧🔗💉💊🚩💦⏱🔇🔈🔉🔊📢📣💤💢💬🔔🔕➕➖➗➰➿⁉❓❔❕❗©®™🔅🔆💯🔠🔡🔢🔣🔤🅰🆎🅱🆑🆒🆓🆔🆕🆖🅾🆗🅿🆘🆙🆚🈶🈚🈲🔺🔻♈♉♊♋♌♍♎♏♐♑♒♓⛎💘❤💓💔💕💖💗💙💚💛💜💝💞💟💴💵💶💷💰💸💳🚥🚦⚓✈🚁🚀🏠🏡🗼🗽📱📲☎📞📟📠🔋🔌💻💽💾💿📀🎥📺📷📹📼🔍🔎🔬🔭📡📔📕📖📗📘📙📚📓📃📜📄📰📑🔖💳✉📧📨📩📤📥📦📫📪📬📭📮✏✒📝📁📂📅📆📇📈📉📊📋📌📍📎📏📐✂🔒🔓🔏🔐🔑

段落缩进

  半角的空格(英文下使用)&ensp;&#8194;
  全角的空格(中文下使用)&emsp;&#8195;
空白行:&nbsp;&#160;注意后面的分号不能丢。

1
2
3
&ensp;&ensp;半角的空格(英文下使用)`&ensp;``&#8194;`
&emsp;&emsp;全角的空格(中文下使用)`&emsp;``&#8195;`
空白行:`&nbsp;``&#160;`注意后面的分号不能丢。

插件

必应每日好图

1
<img src="https://imgapi.cn/bing.php" width=100% height=100%>

看板娘

1
<script defer data-pjax src="https://cdn.jsdelivr.net/gh/stevenjoezhang/live2d-widget@latest/autoload.js"></script>

渐变色

为了人类心智的荣耀
为了人类心智的荣耀
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
<html><head><style>
#grad1 {
height: 70px;
background-image: linear-gradient(to right, #bb313e25, #bb313e25, #d7222925, #dd4a1625, #e4761525, #f5c50025, #f0e92725, #b1ce2425, #48a93525, #03944525, #157c4f25, #176a5825, #1b556325, #1d386f25, #1d386f25, #20277825, #52266325, #8a244b25);
}
#grad2 {
height: 70px;
background-image: linear-gradient(91deg,#f1eefc,#9dc6ff 70%,#a5bcff);
}
#grad3 {
height: 70px;
background-image: linear-gradient(135deg,#56c8ff,#6f99fc);
}
#grad4 {
height: 70px;
background-image: linear-gradient(-225deg, #D4FFEC 0%, #57F2CC 48%, #4596FB 100%);
}
#grad5 {
height: 70px;
background-image: linear-gradient(to right, #acb6e5 , #86fde8 );
}
#grad6 {
height: 70px;
background-image: linear-gradient(-225deg, #9EFBD3 0%, #57E9F2 48%, #45D4FB 100%);
}
#grad7 {
height: 70px;
background-image: linear-gradient(160deg, #00ffd5 20%,#008cff 80%);
}
#grad8 {
height: 70px;
background-image: linear-gradient(-225deg, #2CD8D5 0%, #C5C1FF 56%, #FFBAC3 100%);
}
#grad9 {
height: 70px;
background-image: linear-gradient(102.7deg, #fddaff 8.2%, #dfadfc 19.6%, #adcdfc 36.8%, #adfcf4 73.2%, #caf8d0 90.9%);
}
#grad10 {
height: 70px;
background-image: linear-gradient(50deg, rgb(30,227,207) 10%, rgb(249,188,221) 90%);
}
#grad0 {
height: 70px;
background-image: linear-gradient(to right, rgba(255,0,0,0), rgba(255,0,0,1));
}
</style></head>

<body>
<div id="grad1" align=center><font face="楷体" size=12 color=>为了人类心智的荣耀</font></div>
<div id="grad2" align=center><font face="楷体" size=12 color=>为了人类心智的荣耀</font></div>
<div id="grad3" align=center><font face="楷体" size=12 color=>为了人类心智的荣耀</font></div>
<div id="grad4" align=center><font face="楷体" size=12 color=>为了人类心智的荣耀</font></div>
<div id="grad5" align=center><font face="楷体" size=12 color=>为了人类心智的荣耀</font></div>
<div id="grad6" align=center><font face="楷体" size=12 color=>为了人类心智的荣耀</font></div>
<div id="grad7" align=center><font face="楷体" size=12 color=>为了人类心智的荣耀</font></div>
<div id="grad8" align=center><font face="楷体" size=12 color=>为了人类心智的荣耀</font></div>
<div id="grad9" align=center><font face="楷体" size=12 color=>为了人类心智的荣耀</font></div>
<div id="grad10" align=center><font face="楷体" size=12 color=>为了人类心智的荣耀</font></div>
<div id="grad0" align=center><font face="楷体" size=12 color=>为了人类心智的荣耀</font></div>
</body></html>

英文字体

黑板粗体字
ABCDEFGHIJKLMNOPQRSTUVWXYZ\mathbb{ABCDEFGHIJKLMNOPQRSTUVWXYZ}
abcdefghijklmnopqrstuvwxyz\mathbb{abcdefghijklmnopqrstuvwxyz}
ABCDEFGHIJKLMNOPQRSTUVWXYZ\Bbb{ABCDEFGHIJKLMNOPQRSTUVWXYZ}
abcdefghijklmnopqrstuvwxyz\Bbb{abcdefghijklmnopqrstuvwxyz}
黑体字
ABCDEFGHIJKLMNOPQRSTUVWXYZ\mathbf{ABCDEFGHIJKLMNOPQRSTUVWXYZ}
abcdefghijklmnopqrstuvwxyz\mathbf{abcdefghijklmnopqrstuvwxyz}
打印机字体
ABCDEFGHIJKLMNOPQRSTUVWXYZ\mathtt{ABCDEFGHIJKLMNOPQRSTUVWXYZ}
abcdefghijklmnopqrstuvwxyz\mathtt{abcdefghijklmnopqrstuvwxyz}
ABCDEFGHIJKLMNOPQRSTUVWXYZ\mathscr{ABCDEFGHIJKLMNOPQRSTUVWXYZ}
abcdefghijklmnopqrstuvwxyz\mathscr{abcdefghijklmnopqrstuvwxyz}
ABCDEFGHIJKLMNOPQRSTUVWXYZ\mathcal{ABCDEFGHIJKLMNOPQRSTUVWXYZ}
abcdefghijklmnopqrstuvwxyz\mathcal{abcdefghijklmnopqrstuvwxyz}
ABCDEFGHIJKLMNOPQRSTUVWXYZ\mathsf{ABCDEFGHIJKLMNOPQRSTUVWXYZ}
abcdefghijklmnopqrstuvwxyz\mathsf{abcdefghijklmnopqrstuvwxyz}
ABCDEFGHIJKLMNOPQRSTUVWXYZ\mathrm{ABCDEFGHIJKLMNOPQRSTUVWXYZ}
abcdefghijklmnopqrstuvwxyz\mathrm{abcdefghijklmnopqrstuvwxyz}

脚本运行

脚本运行默认是禁用的,并且需要在Atom和VSCode的插件设置中开启使用。设置名称:enableScriptExecution
请小心使用这一特性,因为它很有可能造成安全问题!当你的脚本运行设置是开启的,你的电脑很有可能被黑客攻击,如果有人使你运行了Markdown文档中的恶意代码。
上传至github则不能使用此功能!只在markdown适用。

{cmd
1
2
3
import matplotlib.pyplot as plt
plt.plot([1,2,3, 4])
plt.show() # show figure
{cmd
1
x = 1
{cmd
1
x = 2
{cmd
1
print(x+3) # will print 4

  1. 第一个注解 ↩︎

  2. 第二个注解 ↩︎