markdown 基础语法

测试 markdown 的基本语法部分，出于可迁移性考虑，忽略 hexo 以及 butterfly 主题所提供的额外语法支持。

标题

支持 markdown 的各级别标题，效果略。

1
2
3
4
5
# title 1
## title 2
### title 3
#### title 4
##### title 5

列表

注意必须在列表的前面空一行，否则语法解析时无法识别为列表。列表支持嵌套，包括两类列表的混合嵌套。

无序列表可以使用星号* XX、减号- XX、加号+ XX等三种样式，目前只使用减号。

  • a
  • b
  • c

有序列表可以使用两种写法：样式一，数学编号1. XX

  1. a
  2. b
  3. c
1
2
3
1. a
2. b
3. c

样式二，全 1 编号 1. XX

  1. a
  2. b
  3. c
1
2
3
1. a
1. b
1. c

待办事项

大部分markdown编辑器支持checkbox样式的待办事项

1
2
- [x] TODO 1
- [ ] TODO 2

效果如下

  • TODO 1
  • TODO 2

引用

可以用> XX表示引用，支持嵌套引用> > XXX，例如

白日依山尽，黄河入海流

众里寻他千百度，慕然回首，那人却在灯火阑珊处。

注意，hexo 以及 butterfly 主题给引用设置了样式。

在 Github README，VSCode 以及 Typora 中可能还支持几种带有特殊语义的 markdown 引用，例如

1
2
3
4
5
6
7
8
9
10
11
12
13
14
> [!NOTE]
> Useful information that users should know, even when skimming content.

> [!TIP]
> Helpful advice for doing things better or more easily.

> [!IMPORTANT]
> Key information users need to know to achieve their goal.

> [!WARNING]
> Urgent info that needs immediate user attention to avoid problems.

> [!CAUTION]
> Advises about risks or negative outcomes of certain actions.

但是测试发现 Hexo 不支持

[!NOTE]
Useful information that users should know, even when skimming content.

[!TIP]
Helpful advice for doing things better or more easily.

[!IMPORTANT]
Key information users need to know to achieve their goal.

[!WARNING]
Urgent info that needs immediate user attention to avoid problems.

[!CAUTION]
Advises about risks or negative outcomes of certain actions.

字体

  • 一对星号包裹起来，表示斜体，例如*斜体*，效果为： 斜体。
  • 两对星号包裹起来，表示加粗，例如**加粗**，效果为：加粗。
  • 两对波浪号包裹起来，表示删除，例如~~删除~~，效果为：删除。

表格

支持 markdown 语法的表格，可以设置左右对齐或居中对齐。

1
2
3
4
| Tittle1 | Tittle2 | Tittle3 |
| :------ | :-----: | ------: |
| Content | Content | Content |
| Content | Content | Content |

效果如下，注意表格前后要留空行。

Tittle1 Tittle2 Tittle3
Content Content Content
Content Content Content

分割线

可以在一行中用三个或以上的星号、减号、底线来建立一个分隔线，行内不能有其他字符，但是不要求连续，中间可以含空格。例如

1
2
3
***
---
___

最好在分割线的前后各留一个空行，防止语法被错误地解析。
可以给分割线提供定制的样式，例如上文的剪刀效果就是 butterfly 主题自带的。

代码

行内的代码使用一对反引号即可（或者更多对也可以），例如printf

1
`printf`

行间的代码块需要使用三对反引号，并且建议标注语言，用于代码高亮。

1
2
3
4
5
6
#include <stdio.h>

int main(){
    printf("Hello,world!\n");
    return 0;
}

图片

可以使用标准 markdown 语法来添加图片，提供对应的 URL 即可，例如本地图片

1
![这是一个图片的标题](./assets/girl.jpg)

效果如下：这是一个图片的标题

这个写法在 hexo 中测试发现存在路径问题，使用 html 语法则正常。

除了标准的 markdown 语法的图片，同样支持 html 语法的插入图片，这种方式可以指定图片比例(如果同时设置了宽度和高度，以宽度缩放为准)

1
<img src="assets/girl.jpg" width="50%"/>

超链接

标准的 markdown 语法。

1
这是一个链接 [显示文本](https://baidu.com "浮动文本")。

效果为：
这是一个链接 显示文本。

链接中尽量避免出现空格，使用%20替代空格是标准做法。

更多

Emoji

例如

  • 常见 💡⭐🐞🚀🌍🚁⚡️🌌⬇️
  • 书本 📔📕📗📘📙📒📃📜📚📖🧾
  • 动植物 🌲🌵🐳🐬🐍🐣
  • 人 🤺✍👌👈👉👆👇
  • 其他 ⚠🚩💬🔨⏰💎

提供一个查询 Emoji 的网站：https://emoji.muan.co/。

一些常用emoji

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
✅✔️➕❌⭕️🟡
📌📍🎈🚩
⏳🌀⏰💤
⚠️🚫🚧
🔍
🔧🔨🛠️⚙️
🔗
🤖
⚡️
🧪
🚀🎉
💥🔥
✨💡⭐
🧠
🐛🪲🐞
🎯
🌱☘️🐣
🔖🏷️
🧬🧩
📖📚📕📗📘📙📒
📝📑📄📃🧾🗒️📋📜📰
✍️✏️
👈👉👆👇
🗂️🧰📦
🔐

音乐

可以在文章中嵌入一个网易云播放器（不能是会员歌曲）

代码如下，可以去网易云网页版复制外链播放器。

1
<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=330 height=86 src="//music.163.com/outchain/player?type=2&id=1488737309&auto=1&height=66"></iframe>

视频

可以嵌入 b 站的视频播放

代码如下，可以去 b 站分享中选择代码。

1
<iframe src="//player.bilibili.com/player.html?aid=938539117&bvid=BV1JT4y1r74p&cid=587958621&page=10" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>

在线文档

对于网上的 PDF 文档等，直接使用 URL，例如：pdf-test，浏览器会直接缓存并在新页面打开它，对于手机端和 iPad 也是一样。

可以在 GitHub 存放文档，使用 URL，例如：README，注意如果希望在 Github 网站打开，是仓库名+blob+分支名+文件名，如果以纯文件的形式打开，需要把 blob 替换为 raw。

Latex 公式测试

行内公式例如 $\frac12$，$\frac{1}{\sqrt{1-x^2}}$。

行间公式例如
$$
f(x) = x^2
$$

$$
g(x)=\left{
\begin{aligned}
& 1, x<1\
& x, otherwise
\end{aligned}
\right.
$$

$$
\begin{aligned}
\frac{\partial \mathbf{u}}{\partial t} + (\mathbf{u}\cdot \nabla) \mathbf{u} &= -\nabla p + \nu \nabla^2 \mathbf{u}\
\nabla \cdot \mathbf{u} &= 0\
\mathbf{u}|_{\partial \Omega} &= \mathbf{u}b\
\mathbf{u}|{t=0} &= \mathbf{u}_0
\end{aligned}
$$

注意跨行大括号可能会渲染错误，建议避免序号。

由于目前这个博客的定位不会涉及到复杂的数学公式，因此不做过多的配置。

如果需要更完整的数学公式支持，可以考虑选择基于 pandoc 的插件

1
2
npm uninstall hexo-renderer-marked
npm install hexo-renderer-pandoc

此时本地也需要安装 pandoc。