Button(按钮)

1
2
这是我的网站,请点击这个按钮进行跳转 {% btn 'https://www.zhaozeyu.top',呓语の小屋 %}
这是我的网站,请点击这个按钮进行跳转 {% btn 'https://www.zhaozeyu.top',呓语の小屋,,outline %}

这是我的网站,请点击这个按钮进行跳转 呓语の小屋
这是我的网站,请点击这个按钮进行跳转 呓语の小屋

Block()

1
2
3
这是我的网站,请点击这个按钮进行跳转 {% btn 'https://www.zhaozeyu.top',呓语の小屋,far fa-hand-point-right,block larger %}
这是我的网站,请点击这个按钮进行跳转 {% btn 'https://www.zhaozeyu.top',呓语の小屋,far fa-hand-point-right,block center larger %}
这是我的网站,请点击这个按钮进行跳转 {% btn 'https://www.zhaozeyu.top',呓语の小屋,far fa-hand-point-right,block right orange larger %}

这是我的网站,请点击这个按钮进行跳转 呓语の小屋
这是我的网站,请点击这个按钮进行跳转 呓语の小屋
这是我的网站,请点击这个按钮进行跳转 呓语の小屋

Option

1
2
3
4
5
6
7
8
9
<div class="btn-center">
{% btn 'https://www.zhaozeyu.top',呓语の小屋,far fa-hand-point-right,larger %}
{% btn 'https://www.zhaozeyu.top',呓语の小屋,far fa-hand-point-right,blue larger %}
{% btn 'https://www.zhaozeyu.top',呓语の小屋,far fa-hand-point-right,pink larger %}
{% btn 'https://www.zhaozeyu.top',呓语の小屋,far fa-hand-point-right,red larger %}
{% btn 'https://www.zhaozeyu.top',呓语の小屋,far fa-hand-point-right,purple larger %}
{% btn 'https://www.zhaozeyu.top',呓语の小屋,far fa-hand-point-right,orange larger %}
{% btn 'https://www.zhaozeyu.top',呓语の小屋,far fa-hand-point-right,green larger %}
</div>
1
2
3
4
5
6
7
8
9
<div class="btn-center">
{% btn 'https://www.zhaozeyu.top',呓语の小屋,far fa-hand-point-right,outline larger %}
{% btn 'https://www.zhaozeyu.top',呓语の小屋,far fa-hand-point-right,outline blue larger %}
{% btn 'https://www.zhaozeyu.top',呓语の小屋,far fa-hand-point-right,outline pink larger %}
{% btn 'https://www.zhaozeyu.top',呓语の小屋,far fa-hand-point-right,outline red larger %}
{% btn 'https://www.zhaozeyu.top',呓语の小屋,far fa-hand-point-right,outline purple larger %}
{% btn 'https://www.zhaozeyu.top',呓语の小屋,far fa-hand-point-right,outline orange larger %}
{% btn 'https://www.zhaozeyu.top',呓语の小屋,far fa-hand-point-right,outline green larger %}
</div>

Note (Bootstrap Callout)

方法一

simple
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
{% 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 提示块标签

modern
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
{% 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 %}

默认 提示块标签

default 提示块标签

primary 提示块标签

success 提示块标签

info 提示块标签

warning 提示块标签

danger 提示块标签

flat
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
{% 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 %}

默认 提示块标签

default 提示块标签

primary 提示块标签

success 提示块标签

info 提示块标签

warning 提示块标签

danger 提示块标签

disabled
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
{% 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 %}

默认 提示块标签

default 提示块标签

primary 提示块标签

success 提示块标签

info 提示块标签

warning 提示块标签

danger 提示块标签

no-icon
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
{% 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 %}

默认 提示块标签

default 提示块标签

primary 提示块标签

success 提示块标签

info 提示块标签

warning 提示块标签

danger 提示块标签

方法二

simple
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
{% note 'fab fa-cc-visa' simple %}
你是刷 Visa 还是 UnionPay
{% endnote %}

{% note blue 'fas fa-bullhorn' simple %}
2024年快到了....
{% 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 %}

你是刷 Visa 还是 UnionPay

2024年快到了….

小心开车 安全至上

这是三片呢?还是四片?

你是刷 Visa 还是 UnionPay

剪刀石头布

前端最讨厌的浏览器

modern
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
{% note 'fab fa-cc-visa' modern %}
你是刷 Visa 还是 UnionPay
{% endnote %}

{% note blue 'fas fa-bullhorn' modern %}
2024年快到了....
{% 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 %}

你是刷 Visa 还是 UnionPay

2024年快到了….

小心开车 安全至上

这是三片呢?还是四片?

你是刷 Visa 还是 UnionPay

剪刀石头布

前端最讨厌的浏览器

flat
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
{% note 'fab fa-cc-visa' flat %}
你是刷 Visa 还是 UnionPay
{% endnote %}

{% note blue 'fas fa-bullhorn' flat %}
2024年快到了....
{% 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 %}

你是刷 Visa 还是 UnionPay

2024年快到了….

小心开车 安全至上

这是三片呢?还是四片?

你是刷 Visa 还是 UnionPay

剪刀石头布

前端最讨厌的浏览器

disabled
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
{% note 'fab fa-cc-visa' disabled %}
你是刷 Visa 还是 UnionPay
{% endnote %}

{% note blue 'fas fa-bullhorn' disabled %}
2024年快到了....
{% 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 %}

你是刷 Visa 还是 UnionPay

2024年快到了….

小心开车 安全至上

这是三片呢?还是四片?

你是刷 Visa 还是 UnionPay

剪刀石头布

前端最讨厌的浏览器

no-icon
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
{% note no-icon %}
你是刷 Visa 还是 UnionPay
{% endnote %}

{% note blue no-icon %}
2024年快到了....
{% 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 %}

你是刷 Visa 还是 UnionPay

2024年快到了….

小心开车 安全至上

这是三片呢?还是四片?

你是刷 Visa 还是 UnionPay

剪刀石头布

前端最讨厌的浏览器

待补充… …