Built-in Markdown Formatting
Reference: Markdown 语法图文全面详解(10 分钟学会)
Note: This page may occasionally have CSS conflict issues!
Code Blocks
\```sh
# VSCode终端
hexo clean; hexo s
hexo clean; hexo g; hexo d
git add .; git commit -m "npm publish"; npm version patch;
git push
# Cmder终端
hexo clean && hexo s
hexo clean && hexo g && hexo d
git add . && git commit -m "npm publish" && npm version patch
git push
\```# VSCode终端
hexo clean; hexo s
hexo clean; hexo g; hexo d
git add .; git commit -m "npm publish"; npm version patch;
git push
# Cmder终端
hexo clean && hexo s
hexo clean && hexo g && hexo d
git add . && git commit -m "npm publish" && npm version patch
git pushMulti-level Headings
# H1
## H2
### H3
#### H4
##### H5
###### H6See the headings in this article!
Text Styles
<u>下划线演示</u>
文字**加粗**演示
文字*斜体*演示
文本`高亮`演示
文本~~删除~~线演示Underline demo
Text bold demo
Text italic demo
Text 高亮 demo
Text strikethrough demo
For the points above, refer to: 【Markdown 语法】字体颜色大小及文字底色设置
Blockquotes
> Java
> 二级引用演示
> MySQL
> >外键
> >
> >事务
> >
> >**行级锁**(引用内部一样可以用格式)
>
> ....Java
Second-level blockquote demo
MySQLForeign key
Transaction
Row-level lock (formatting works inside blockquotes too)
…
Horizontal Rule
---
***Lists (*, +, - all work as long as they are followed by a space)
Unordered List
* Java
* Python
* ...
+ Java
+ Python
+ ...
- Java
- Python
- ...- Java
- Python
- …
- Java
- Python
- …
- Java
- Python
- …
Ordered List
# 注意后面有空格
1.
2.
3.
4.Images

Tables
| 项目标号 | 资金 | 备注 |
| -------- | -------- | ---- |
| 1 | 100,000 | 无 |
| 2 | 200,000 | 无 |
| 3 | 300,600 | 重要 || Item No. | Funds | Remarks |
|---|---|---|
| 1 | 100,000 | None |
| 2 | 200,000 | None |
| 3 | 300,600 | Important |
Butterfly External Tags
This part references Anzhiyu: 安知鱼主题标签 Tag Plugins
Blockquote note
note:
# Note tag style values:
# - simple bs-callout old alert style. Default.
# - modern bs-callout new (v2-v3) alert style.
# - flat flat callout style with background, like on Mozilla or StackOverflow.
# - disabled disable all CSS styles import of note tag.
style: flat
icons: true
border_radius: 3
# Offset lighter of background in % for modern and flat styles (modern: -12 | 12; flat: -18 | 6).
# Offset also applied to label tag variables. This option can work with disabled note tag.
light_bg_offset: 0# 自带icon
{% note [class] [no-icon] [style] %}
Any content (support inline tags too.io).
{% endnote %}
# 外部icon
{% note [color] [icon] [style] %}
Any content (support inline tags too.io).
{% endnote %}- Built-in icon
| Parameter | Usage |
|---|---|
| class | [Optional] Identifier; different identifiers come with different color schemes ( default / primary / success / info / warning / danger ) |
| no-icon | [Optional] Do not display the icon |
| style | [Optional] Overrides the style set in the config (simple/modern/flat/disabled) |
- External icon
| Parameter | Usage |
|---|---|
| class | [Optional] Identifier; different identifiers produce different color schemes ( default / blue / pink / red / purple / orange / green ) |
| no-icon | [Optional] Custom icon can be configured (only FontAwesome icons are supported, or set no-icon ) |
| style | [Optional] Overrides the style set in the config (simple/modern/flat/disabled) |
1.自带icon
1.simple style
{% note simple %}默认 提示块标签{% endnote %}
{% note default simple %}default 提示块标签{% endnote %}
{% note primary simple %}primary 提示块标签{% endnote %}
{% note success simple %}success 提示块标签{% endnote %}
{% note info simple %}info 提示块标签{% endnote %}
{% note warning simple %}warning 提示块标签{% endnote %}
{% note danger simple %}danger 提示块标签{% endnote %}2.modern style
{% note modern %}默认 提示块标签{% endnote %}
{% note default modern %}default 提示块标签{% endnote %}
{% note primary modern %}primary 提示块标签{% endnote %}
{% note success modern %}success 提示块标签{% endnote %}
{% note info modern %}info 提示块标签{% endnote %}
{% note warning modern %}warning 提示块标签{% endnote %}
{% note danger modern %}danger 提示块标签{% endnote %}3.flat style
{% note flat %}默认 提示块标签{% endnote %}
{% note default flat %}default 提示块标签{% endnote %}
{% note primary flat %}primary 提示块标签{% endnote %}
{% note success flat %}success 提示块标签{% endnote %}
{% note info flat %}info 提示块标签{% endnote %}
{% note warning flat %}warning 提示块标签{% endnote %}
{% note danger flat %}danger 提示块标签{% endnote %}4.disabled style
{% note disabled %}默认 提示块标签{% endnote %}
{% note default disabled %}default 提示块标签{% endnote %}
{% note primary disabled %}primary 提示块标签{% endnote %}
{% note success disabled %}success 提示块标签{% endnote %}
{% note info disabled %}info 提示块标签{% endnote %}
{% note warning disabled %}warning 提示块标签{% endnote %}
{% note danger disabled %}danger 提示块标签{% endnote %}5.no-icon style
{% note no-icon %}默认 提示块标签{% endnote %}
{% note default no-icon %}default 提示块标签{% endnote %}
{% note primary no-icon %}primary 提示块标签{% endnote %}
{% note success no-icon %}success 提示块标签{% endnote %}
{% note info no-icon %}info 提示块标签{% endnote %}
{% note warning no-icon %}warning 提示块标签{% endnote %}
{% note danger no-icon %}danger 提示块标签{% endnote %}2.外部icon
1.simple style
{% note 'fab fa-cc-visa' simple %}你是刷 Visa 还是 UnionPay{% endnote %}
{% note blue 'fas fa-bullhorn' simple %}2021 年快到了....{% endnote %}
{% note pink 'fas fa-car-crash' simple %}小心开车 安全至上{% endnote %}
{% note red 'fas fa-fan' simple%}这是三片呢?还是四片?{% endnote %}
{% note orange 'fas fa-battery-half' simple %}你是刷 Visa 还是 UnionPay{% endnote %}
{% note purple 'far fa-hand-scissors' simple %}剪刀石头布{% endnote %}
{% note green 'fab fa-internet-explorer' simple %}前端最讨厌的浏览器{% endnote %}2.modern style
{% note 'fab fa-cc-visa' modern %}你是刷 Visa 还是 UnionPay{% endnote %}
{% note blue 'fas fa-bullhorn' modern %}2021 年快到了....{% endnote %}
{% note pink 'fas fa-car-crash' modern %}小心开车 安全至上{% endnote %}
{% note red 'fas fa-fan' modern%}这是三片呢?还是四片?{% endnote %}
{% note orange 'fas fa-battery-half' modern %}你是刷 Visa 还是 UnionPay{% endnote %}
{% note purple 'far fa-hand-scissors' modern %}剪刀石头布{% endnote %}
{% note green 'fab fa-internet-explorer' modern %}前端最讨厌的浏览器{% endnote %}3.flat style
{% note 'fab fa-cc-visa' flat %}你是刷 Visa 还是 UnionPay{% endnote %}
{% note blue 'fas fa-bullhorn' flat %}2021 年快到了....{% endnote %}
{% note pink 'fas fa-car-crash' flat %}小心开车 安全至上{% endnote %}
{% note red 'fas fa-fan' flat%}这是三片呢?还是四片?{% endnote %}
{% note orange 'fas fa-battery-half' flat %}你是刷 Visa 还是 UnionPay{% endnote %}
{% note purple 'far fa-hand-scissors' flat %}剪刀石头布{% endnote %}
{% note green 'fab fa-internet-explorer' flat %}前端最讨厌的浏览器{% endnote %}4.disabled style
{% note 'fab fa-cc-visa' disabled %}你是刷 Visa 还是 UnionPay{% endnote %}
{% note blue 'fas fa-bullhorn' disabled %}2021 年快到了....{% endnote %}
{% note pink 'fas fa-car-crash' disabled %}小心开车 安全至上{% endnote %}
{% note red 'fas fa-fan' disabled %}这是三片呢?还是四片?{% endnote %}
{% note orange 'fas fa-battery-half' disabled %}你是刷 Visa 还是 UnionPay{% endnote %}
{% note purple 'far fa-hand-scissors' disabled %}剪刀石头布{% endnote %}
{% note green 'fab fa-internet-explorer' disabled %}前端最讨厌的浏览器{% endnote %}5.no-icon style
{% note no-icon %}你是刷 Visa 还是 UnionPay{% endnote %}
{% note blue no-icon %}2021 年快到了....{% endnote %}
{% note pink no-icon %}小心开车 安全至上{% endnote %}
{% note red no-icon %}这是三片呢?还是四片?{% endnote %}
{% note orange no-icon %}你是刷 Visa 还是 UnionPay{% endnote %}
{% note purple no-icon %}剪刀石头布{% endnote %}
{% note green no-icon %}前端最讨厌的浏览器{% endnote %}1.自带icon
1.simple style
Default note block label
default note block label
primary note block label
success note block label
info note block label
warning note block label
danger note block label
2.modern style
Default note block label
default note block label
primary note block label
success note block label
info note block label
warning note block label
danger note block label
3.flat style
Default note block label
default note block label
primary note block label
success note block label
info note block label
warning note block label
danger note block label
4.disabled style
Default note block label
default note block label
primary note block label
success note block label
info note block label
warning note block label
danger note block label
5.no-icon style
2.外部icon
1.simple style
Are you paying with Visa or UnionPay
2021 is almost here…
Drive carefully, safety first
Are these three slices? Or four?
Are you paying with Visa or UnionPay
Rock paper scissors
The browser front-end developers hate most
2.modern style
Are you paying with Visa or UnionPay
2021 is almost here…
Drive carefully, safety first
Are these three slices? Or four?
Are you paying with Visa or UnionPay
Rock paper scissors
The browser front-end developers hate most
3.flat style
Are you paying with Visa or UnionPay
2021 is almost here…
Drive carefully, safety first
Are these three slices? Or four?
Are you paying with Visa or UnionPay
Rock paper scissors
The browser front-end developers hate most
4.disabled style
Are you paying with Visa or UnionPay
2021 is almost here…
Drive carefully, safety first
Are these three slices? Or four?
Are you paying with Visa or UnionPay
Rock paper scissors
The browser front-end developers hate most
5.no-icon style
Timeline timeline
{% timeline 时间线标题(可选)[,color] %}
<!-- timeline 时间节点(标题) -->
正文内容
<!-- endtimeline -->
<!-- timeline 时间节点(标题) -->
正文内容
<!-- endtimeline -->
{% endtimeline %}title: title/timelinecolor:timelinecolor: default (leave blank) / blue / pink / red / purple / orange / green
{% timeline 时间轴样式,blue %}
<!-- timeline 2020-07-24 [2.6.6 -> 3.0](https://github.com/volantis-x/hexo-theme-volantis/releases) -->
1. 如果有 `hexo-lazyload-image` 插件,需要删除并重新安装最新版本,设置 `lazyload.isSPA: true`。
2. 2.x 版本的 css 和 js 不适用于 3.x 版本,如果使用了 `use_cdn: true` 则需要删除。
3. 2.x 版本的 fancybox 标签在 3.x 版本中被重命名为 gallery 。
4. 2.x 版本的置顶 `top: true` 改为了 `pin: true`,并且同样适用于 `layout: page` 的页面。
5. 如果使用了 `hexo-offline` 插件,建议卸载,3.0 版本默认开启了 pjax 服务。
<!-- endtimeline -->
<!-- timeline 2020-05-15 [2.6.3 -> 2.6.6](https://github.com/volantis-x/hexo-theme-volantis/releases/tag/2.6.6) -->
不需要额外处理。
<!-- endtimeline -->
<!-- timeline 2020-04-20 [2.6.2 -> 2.6.3](https://github.com/volantis-x/hexo-theme-volantis/releases/tag/2.6.3) -->
1. 全局搜索 `seotitle` 并替换为 `seo_title`。
2. group 组件的索引规则有变,使用 group 组件的文章内,`group: group_name` 对应的组件名必须是 `group_name`。
2. group 组件的列表名优先显示文章的 `short_title` 其次是 `title`。
<!-- endtimeline -->
{% endtimeline %}时间轴样式
2020-07-24 2.6.6 -> 3.0
- If you have the
hexo-lazyload-imageplugin, you need to delete it and reinstall the latest version, then setlazyload.isSPA: true. - The css and js of version 2.x are not compatible with version 3.x; if you have used
use_cdn: true, it must be deleted. - The fancybox tag in version 2.x was renamed to gallery in version 3.x.
- The pin-to-top
top: truein version 2.x was changed topin: true, and it also applies tolayout: pagepages. - If you use the
hexo-offlineplugin, it is recommended that you uninstall it; version 3.0 enables the pjax service by default.
2020-05-15 2.6.3 -> 2.6.6
No additional handling is required.
2020-04-20 2.6.2 -> 2.6.3
- Search globally for
seotitleand replace it withseo_title. - The indexing rules of the group component have changed. In articles that use the group component, the component name corresponding to
group: group_namemust begroup_name. - For the list name of the group component, the article’s
short_titleis displayed first, followed bytitle.
Gallery gallery
- gallerygroup album gallery
<div class="gallery-group-main">
{% galleryGroup name description link img-url %}
{% galleryGroup name description link img-url %}
{% galleryGroup name description link img-url %}
</div>- gallery album
{% gallery %}
markdown 圖片格式
{% endgallery %}- gallerygroup photo gallery
| Parameter | Description |
|---|---|
| name | Gallery name |
| description | Gallery description |
| link | URL linking to the corresponding album |
| img-url | Gallery cover |
gallery album
Unlike the old Gallery album, the new Gallery album automatically arranges the layout according to image length, and is also more convenient to write, just like the markdown format. You can insert it into the corresponding md as needed. No need to configure width and height yourself anymore. It is recommended to deliberately use images of different lengths, sizes, and orientations when pasting, which will produce better results. (Images of exactly the same size will only be tiled, and the result is terrible.)
1.gallerygroup photo gallery
<div class="gallery-group-main">
{% galleryGroup MC 在Rikkaの六花服务器里留下的足迹 '/gallery/MC/' https://cdn.cbd.int/[email protected]/image/1.jpg %}
{% galleryGroup Gundam 哦咧哇gundam哒! '/gallery/Gundam/' https://cdn.cbd.int/[email protected]/image/20200907110508327.png %}
{% galleryGroup I-am-Akilar 某种意义上也算自拍吧 '/gallery/I-am-Akilar/' https://cdn.cbd.int/[email protected]/image/20200907113116651.png %}
</div>2.gallery album
{% gallery %}


{% endgallery %}Column tabs
{% tabs Unique name, [index] %}
<!-- tab [Tab caption] [@icon] -->
Any content (support inline tags too).
<!-- endtab -->
{% endtabs %}Unique name :
The unique name of the tab block label, without commas.
Used in the #id as the prefix for each tab and its index number.
If the name contains spaces, all spaces will be replaced by dashes when generating the #id.
It only needs to be unique within the current post/page URL!
[index]:
The index number of the active tab.
If not specified, the first tab (1) will be selected.
If index is -1, no tab will be selected.
Optional parameter.
[Tab caption]:
The caption of the current tab.
If no caption is specified, the unique name with a tab index suffix will be used as the tab caption.
If no caption is specified but an icon is, the caption will be empty.
Optional parameter.
[@icon]:
FontAwesome icon name (full name, looks like “fas fa-font”)
Can be specified with or without a space;
For example, ‘Tab caption @icon’ and ‘Tab caption@icon’.
Optional parameter.
1.Demo 1 - selects the first one by default [Default]
{% tabs test1 %}
<!-- tab -->
**This is Tab 1.**
<!-- endtab -->
<!-- tab -->
**This is Tab 2.**
<!-- endtab -->
<!-- tab -->
**This is Tab 3.**
<!-- endtab -->
{% endtabs %}2.Demo 2 - preselects tabs
{% tabs test2, 3 %}
<!-- tab -->
**This is Tab 1.**
<!-- endtab -->
<!-- tab -->
**This is Tab 2.**
<!-- endtab -->
<!-- tab -->
**This is Tab 3.**
<!-- endtab -->
{% endtabs %}3.Demo 3 - no preset value
{% tabs test3, -1 %}
<!-- tab -->
**This is Tab 1.**
<!-- endtab -->
<!-- tab -->
**This is Tab 2.**
<!-- endtab -->
<!-- tab -->
**This is Tab 3.**
<!-- endtab -->
{% endtabs %}4.Demo 4 - custom Tab name + icon only + icon and Tab name
{% tabs test4 %}
<!-- tab 第一个Tab -->
**tab 名字为第一个 Tab**
<!-- endtab -->
<!-- tab @fab fa-apple-pay -->
**只有图标 没有 Tab 名字**
<!-- endtab -->
<!-- tab 炸弹@fas fa-bomb -->
**名字+icon**
<!-- endtab -->
{% endtabs %}Hidden Block
{% hideBlock display,bg,color %}
content
{% endhideBlock %}- content: the content to be hidden
- display: the text shown on the button before it is revealed (optional)
- bg: the background color of the button (optional)
- color: the color of the text on the button (optional)
{% hideBlock 点我预览, blue %}
这里有张图片:
<img src="https://registry.npmmirror.com/js-asuna/latest/files/pic/Asuna/Asuna16x9.webp" alt="Asuna" />
{% endhideBlock %}