各个代码来自主题文档或者糖果屋
测试图床：

vvvv

mermaid

通用（typora可用）

 graph TD
    a --> b
1
2
graph TD
  a --> b

butterfly专用（我一般不用）

pie title Key elements in Product X "Calcium" : 42.96 "Potassium" : 50.05 "Magnesium" : 10.01 "Iron" : 5
1
2
3
4
5
6
7
8
{% mermaid %}
pie
    title Key elements in Product X
    "Calcium" : 42.96
    "Potassium" : 50.05
    "Magnesium" : 10.01
    "Iron" :  5
{% endmermaid %}

wowjs

参数备选值 / 类型释义
enabletrue/false【必选】控制开关
prioritynumber【可选】过滤器优先级，数值越小，执行越早，默认为 10，选填
mobiletrue/false控制移动端是否启用，默认移动端禁用
animateitem.classclass【可选】添加动画类名，只支持给 class 添加
animateitem.styletext【可选】动画样式，具体类型参考 animate.css
animateitem.durationtime, 单位为 s 或 ms【可选】动画持续时间，单位可以是 ms 也可以是 s。例如 3s，700ms。
animateitem.delaytime, 单位为 s 或 ms【可选】动画开始的延迟时间，单位可以是 ms 也可以是 s。例如 3s，700ms。
animateitem.offsetnumber, 单位为 px【可选】开始动画的距离（相对浏览器底部）。
animateitem.iterationnumber, 单位为 s 或 ms【可选】动画重复的次数

flip动画效果。

1
2
3
4
5
{% wow animate__flip %}
{% note green 'fas fa-fan' modern%}
`flip`动画效果。
{% endnote %}
{% endwow %}

zoomIn

zoomIn动画效果，持续5s，延时5s，离底部100距离时启动，重复10次

1
2
3
4
5
{% wow animate__zoomIn,5s,5s,100,10 %}
{% note blue 'fas fa-bullhorn' modern%}
`zoomIn`动画效果，持续`5s`，延时`5s`，离底部`100`距离时启动，重复`10`次
{% endnote %}
{% endwow %}

slideInRight

slideInRight动画效果，持续5s，延时5s。

1
2
3
4
5
{% wow animate__slideInRight,5s,5s %}
{% note orange 'fas fa-car' modern%}
`slideInRight`动画效果，持续`5s`，延时`5s`。
{% endnote %}
{% endwow %}

heartBeat

heartBeat动画效果，延时5s，重复10次。

1
2
3
4
5
{% wow animate__heartBeat,,5s,,10 %}
{% note red 'fas fa-battery-half' modern%}
`heartBeat`动画效果，延时`5s`，重复`10`次。
{% endnote %}
{% endwow %}
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
{% 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 %}



默认 提示块标籤

default 提示块标籤

primary 提示块标籤

success 提示块标籤

info 提示块标籤

warning 提示块标籤

danger 提示块标籤

label

中道崩殂
1
{% label 中道崩殂 blue %}

tab

This is Tab 1.

This is Tab 2.

This is Tab 3.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
{% tabs test1 %}
<!-- tab -->
**This is Tab 1.**
<!-- endtab -->

<!-- tab -->
**This is Tab 2.**
<!-- endtab -->

<!-- tab -->
**This is Tab 3.**
<!-- endtab -->
{% endtabs %}

button

This is my website, click the button Butterfly

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
{% btn [url],[text],[icon],[color] [style] [layout] [position] [size] %}

[url]         : 链接
[text]        : 按钮文字
[icon]        : [可选] 图标
[color]       : [可选] 按钮背景顔色(默认style时）
                      按钮字体和边框顔色(outline时)
                      default/blue/pink/red/purple/orange/green
[style]       : [可选] 按钮样式 默认实心
                      outline/留空
[layout]      : [可选] 按钮佈局 默认为line
                      block/留空
[position]    : [可选] 按钮位置 前提是设置了layout为block 默认为左边
                      center/right/留空
[size]        : [可选] 按钮大小
                      larger/留空