|
|
|
|
|
---
|
|
|
|
|
|
title: Markdown 语法
|
|
|
|
|
|
description: Halo 编辑器中所支持的 Markdown 语法说明
|
|
|
|
|
|
---
|
|
|
|
|
|
|
|
|
|
|
|
## 基础语法
|
|
|
|
|
|
|
|
|
|
|
|
Halo 使用的 `Markdown` 解析器为 [flexmark-java](https://github.com/vsch/flexmark-java)，基于 [CommonMark (spec 0.28)](https://spec.commonmark.org/0.28/) 标准开发，语法参考：[https://spec.commonmark.org/0.28/](https://spec.commonmark.org/0.28/)。
|
|
|
|
|
|
|
|
|
|
|
|
## 代码块
|
|
|
|
|
|
|
|
|
|
|
|
```language
|
|
|
|
|
|
代码块
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
其中，language 为必填，如果不填写，很可能主题的代码高亮插件无法识别代码的语言，导致样式异常。举几个例子：
|
|
|
|
|
|
|
|
|
|
|
|
```java
|
|
|
|
|
|
public static void main(String[] args){
|
|
|
|
|
|
System.out.println("Hello World!");
|
|
|
|
|
|
}
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
|
console.log("Hello World!")
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
## TOC
|
|
|
|
|
|
|
|
|
|
|
|
在文章的最前面加上 `[TOC]` 即可。
|
|
|
|
|
|
|
|
|
|
|
|
## 自动链接
|
|
|
|
|
|
|
|
|
|
|
|
支持自动将一个链接解析为可点击的格式，如下：
|
|
|
|
|
|
|
|
|
|
|
|
````markdown
|
|
|
|
|
|
https://halo.run
|
|
|
|
|
|
````
|
|
|
|
|
|
|
|
|
|
|
|
将被解析为：
|
|
|
|
|
|
|
|
|
|
|
|
```html
|
|
|
|
|
|
<a href="https://halo.run">https://halo.run</a>
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
## Emoji
|
|
|
|
|
|
|
|
|
|
|
|
支持将 Emoji 的文字形式转化为图片形式，如下：
|
|
|
|
|
|
|
|
|
|
|
|
```markdown
|
|
|
|
|
|
:100:
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
将被解析为：
|
|
|
|
|
|
|
|
|
|
|
|
```html
|
|
|
|
|
|
💯
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
更多 Emoji 表情可访问：[https://emoji.svend.cc](https://emoji.svend.cc)
|
|
|
|
|
|
|
|
|
|
|
|
## 数学公式
|
|
|
|
|
|
|
|
|
|
|
|
行内公式：
|
|
|
|
|
|
|
|
|
|
|
|
```markdown
|
|
|
|
|
|
$a \ne 0$
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
段落公式：
|
|
|
|
|
|
|
|
|
|
|
|
```markdown
|
|
|
|
|
|
$$
|
|
|
|
|
|
x = {-b \pm \sqrt{b^2-4ac} \over 2a}.
|
|
|
|
|
|
$$
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
> 需要注意的是，并不是每一款主题都支持显示数学公式，你可以先到你使用的主题设置中查看是否支持，如不支持，请看下面的解决方案。
|
|
|
|
|
|
|
|
|
|
|
|
首先，登陆到后台，进入 `系统 -> 博客设置 -> 其他设置`。将下面的代码复制到 `自定义内容页面 head`。
|
|
|
|
|
|
|
|
|
|
|
|
```html
|
|
|
|
|
|
<script src="//cdn.jsdelivr.net/npm/mathjax@2.7.5/unpacked/MathJax.js?config=TeX-MML-AM_CHTML" defer></script>
|
|
|
|
|
|
<script>
|
|
|
|
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
|
|
|
|
MathJax.Hub.Config({
|
|
|
|
|
|
'HTML-CSS': {
|
|
|
|
|
|
matchFontHeight: false
|
|
|
|
|
|
},
|
|
|
|
|
|
SVG: {
|
|
|
|
|
|
matchFontHeight: false
|
|
|
|
|
|
},
|
|
|
|
|
|
CommonHTML: {
|
|
|
|
|
|
matchFontHeight: false
|
|
|
|
|
|
},
|
|
|
|
|
|
tex2jax: {
|
|
|
|
|
|
inlineMath: [
|
|
|
|
|
|
['$','$'],
|
|
|
|
|
|
['\\(','\\)']
|
|
|
|
|
|
],
|
|
|
|
|
|
displayMath: [["$$", "$$"], ["\\[", "\\]"]]
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
});
|
|
|
|
|
|
</script>
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
## 图表
|
|
|
|
|
|
|
|
|
|
|
|
饼图：
|
|
|
|
|
|
|
|
|
|
|
|
````markdown
|
|
|
|
|
|
```mermaid
|
|
|
|
|
|
pie title NETFLIX
|
|
|
|
|
|
"Time spent looking for movie" : 90
|
|
|
|
|
|
"Time spent watching it" : 10
|
|
|
|
|
|
```
|
|
|
|
|
|
````
|
|
|
|
|
|
|
|
|
|
|
|
更多用法查看：[https://mermaidjs.github.io/#/](https://mermaidjs.github.io/#/)
|
|
|
|
|
|
|
|
|
|
|
|
> 需要注意的是，并不是每一款主题都支持显示图表，你可以先到你使用的主题设置中查看是否支持，如不支持，请看下面的解决方案。
|
|
|
|
|
|
|
|
|
|
|
|
首先，登陆到后台，进入 `系统 -> 博客设置 -> 其他设置`。将下面的代码复制到 `自定义内容页面 head`。
|
|
|
|
|
|
|
|
|
|
|
|
```html
|
|
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/mermaid@8.4.4/dist/mermaid.min.js"></script>
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
## 短连接
|
|
|
|
|
|
|
|
|
|
|
|
:::tip
|
|
|
|
|
|
这属于实验性特性，也许我们将在未来的版本移除这个特性。
|
|
|
|
|
|
:::
|
|
|
|
|
|
|
|
|
|
|
|
Halo 内置一些短连接以更好地支持一些 HTML 语法，但是编辑器目前并不能解析，只能发布之后才可以看到效果，如下：
|
|
|
|
|
|
|
|
|
|
|
|
### 网易云音乐
|
|
|
|
|
|
|
|
|
|
|
|
#### 语法
|
|
|
|
|
|
|
|
|
|
|
|
```markdown
|
|
|
|
|
|
[music:id]
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
#### 示例
|
|
|
|
|
|
|
|
|
|
|
|
```markdown
|
|
|
|
|
|
[music:32507038]
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
#### 解析结果
|
|
|
|
|
|
|
|
|
|
|
|
```html
|
|
|
|
|
|
<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=330 height=86 src="//music.163.com/outchain/player?type=2&id=32507038&auto=1&height=66"></iframe>
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
### 哔哩哔哩动画
|
|
|
|
|
|
|
|
|
|
|
|
#### 语法
|
|
|
|
|
|
|
|
|
|
|
|
```markdown
|
|
|
|
|
|
[bilibili:aid,width,height]
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
#### 示例
|
|
|
|
|
|
|
|
|
|
|
|
```markdown
|
|
|
|
|
|
[bilibili:65898131,256,256]
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
#### 解析结果
|
|
|
|
|
|
|
|
|
|
|
|
```html
|
|
|
|
|
|
<iframe height="256" width="256" src="//player.bilibili.com/player.html?aid=65898131" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
## 脚注
|
|
|
|
|
|
|
|
|
|
|
|
#### 语法
|
|
|
|
|
|
|
|
|
|
|
|
```markdown
|
|
|
|
|
|
[^脚注名]
|
|
|
|
|
|
[^脚注名]: 脚注内容
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
#### 示例
|
|
|
|
|
|
|
|
|
|
|
|
```markdown
|
|
|
|
|
|
驿外[^1]断桥边，寂寞开无主。已是黄昏独自愁，更着风和雨
|
|
|
|
|
|
[^1]: 驿（yì）外：指荒僻、冷清之地。驿，驿站。
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
#### 解析结果
|
|
|
|
|
|
|
|
|
|
|
|
```html
|
|
|
|
|
|
<p>驿外<sup class="footnote-ref"><a href="#fn1" id="fnref1">[1]</a></sup>断桥边，寂寞开无主。已是黄昏独自愁，更着风和雨</p>
|
|
|
|
|
|
<hr class="footnotes-sep">
|
|
|
|
|
|
<section class="footnotes">
|
|
|
|
|
|
<ol class="footnotes-list">
|
|
|
|
|
|
<li id="fn1" class="footnote-item"><p>驿（yì）外：指荒僻、冷清之地。驿，驿站。 <a href="#fnref1" class="footnote-backref">↩︎</a></p>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
</ol>
|
|
|
|
|
|
</section>
|
|
|
|
|
|
```
|
