外挂标签

为简单的一句话提供的简便写法。

下划线 的文本

着重号 的文本

波浪线 的文本

删除线 的文本

键盘样式的文本 command + D

密码样式的文本:这里没有验证码

彩色文字
在一段话中方便插入各种颜色的标签,包括:红色黄色绿色青色蓝色灰色。超大号文字

文档「开始」页面中的标题部分就是超大号文字。

A Wonderful Theme for Hexo

绿色 + 默认选中

时间线标题(可选)[

时间节点(标题)

正文内容

时间节点(标题)

正文内容

作者: Chaospring
链接: https://chaospring.com/posts/4770/#%E6%8C%89%E9%92%AE-btns
来源: Chaospring
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

脚注footnotes测试1,脚注英文2,脚注中文3

查看默认打开的折叠框

这是一个默认打开的折叠框。

This is Tab 1.

This is Tab 2.

This is Tab 3.

默认情况

default

info

success

error

warning

bolt

ban

home

sync

cogs

key

bell

自定义font awesome图标

默认 提示块标签

你是刷 Visa 还是 UnionPay

primary 提示块标签

小心开车 安全至上

你是刷 Visa 还是 UnionPay

2021年快到了....

小心开车 安全至上

这是三片呢?还是四片?

你是刷 Visa 还是 UnionPay

剪刀石头布

前端最讨厌的浏览器

进度条样式预览

进度条样式预览

进度条样式预览

进度条样式预览

进度条样式预览

进度条样式预览

mermaid绘图

graph TB;
subgraph 分情况
A(开始)-->B{判断}
end
B--第一种情况-->C[第一种方案]
B--第二种情况-->D[第二种方案]
B--第三种情况-->F{第三种方案}
subgraph 分种类
F-.第1个.->J((测试圆形))
F-.第2个.->H>右向旗帜形]
end
H---I(测试完毕)
C--票数100---I(测试完毕)
D---I(测试完毕)
J---I(测试完毕)
sequenceDiagram
Title: 小明买书

participant consumer as 小明
participant store as 书店
participant publisher as 出版社

consumer ->> store: 想买一本限量版书籍
store -->> consumer: 缺货
consumer ->> store: 隔一个月再次询问
store -->> consumer: 抢完了
loop 一个星期一次
consumer -x +store: 有货了吗
store --x -consumer: 正在订,有货马上通知你
end

store ->> publisher: 我要订购一批货
publisher --x store: 返回所有书籍的类别信息

alt 书籍类别符合要求
store ->> publisher: 请求书单信息
publisher --x store: 返回该类别书单信息
else 书单里的书有市场需求
store ->> publisher: 购买指定数据
publisher --x store: 确认订单
else 书籍不符合要求
store -->> publisher: 暂时不购买
end

par 并行执行
publisher ->> publisher : 生产
publisher ->> publisher : 销售
end

opt 书籍购买量>=500 && 库存>=50
publisher ->> store : 出货
store --x publisher : 确认收货
end

Note left of consumer : 图书收藏家
Note over consumer,store : 去书店购买书籍
Note left of store : 全国知名书店
Note over store,publisher : 去出版社进货
Note left of publisher : 持有版权的出版社
pie
 title Pie Chart
 "Dogs" : 386
 "cats" : 567
 "rabbit" : 700
 "pig":365
 "tiger" : 15
%%{init: { "sequence-theme": "hand" } }%%

timeline
        title England's History Timeline
        section Stone Age
          7600 BC : Britain's oldest known house was built in Orkney, Scotland
          6000 BC : Sea levels rise and Britain becomes an island.
The people who live here are hunter-gatherers. section Bronze Age 2300 BC : People arrive from Europe and settle in Britain.
They bring farming and metalworking. : New styles of pottery and ways of burying the dead appear. 2200 BC : The last major building works are completed at Stonehenge.
People now bury their dead in stone circles. : The first metal objects are made in Britain.Some other nice things happen. it is a good time to be alive. 2200 BC : The last major building works are completed at Stonehenge.
People now bury their dead in stone circles. : The first metal objects are made in Britain.Some other nice things happen. it is a good time to be alive.
%%{init: { "sequence": { "wrap": true} } }%%
sequenceDiagram

Alice->Bob: Hello Bob, how are you?
Bob->Alice: Fine, how did you mother like the book I suggested? And did you catch the new book about alien invasion?
Alice->Bob: Good.
Bob->Alice: Cool

github style alert

1
2
> [!NOTE]
> Information the user should notice even if skimming.$a \leq b$

Note

Information the user should notice even if skimming.\(a \leq b\)

1
2
> [!tip]
> Information the user should notice even if skimming.

Tip

Information the user should notice even if skimming.

1
2
> [!important]
> Information the user should notice even if skimming.

Important

Information the user should notice even if skimming.

1
2
> [!caution]
Information the user should notice even if skimming.

Caution

Information the user should notice even if skimming.

Tip

Optional information to help a user be more successful.

Important

Essential information required for user success.aaa

sdfkahsdkfhkaskdfhkashkdfhkashdkfkashdkfhkasdhkfkasdhkfhaskdhf
ashdkfhkasdkfhkas
ahksdhfkasjkdfhaskdfh

Important

Essential information required for user success.aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
sdfkahsdkfhkaskdfhkashkdfhkashdkfkashdkfhkasdhkfkasdhkfhaskdhf
ashdkfhkasdkfhkas
ahksdhfkasjkdfhaskdfh

Caution

Negative potential consequences of an action.
tesesdfksdhfkksd

Warning

Dangerous certain consequences of an action.

test

esskdf\(a \leq b\)

sdflsj
sdfsdfhkaaosofosajdf

sdfsdf
asdfasdf
asdfasdf
asdfasdfasdf

Note

sdfskjdhf
sdfskhdkf'
askdfhkashdf
aksdhfkas

Note

sdfskjdhf

sdfskhdkf'

askdfhkashdf

aksdhfkas

admonition

Hexo-admonition 插件使用示例

这是基于 hexo-admonition 插件渲染的一条提示信息。类型为 note,并设置了自定义标题。

提示内容开头留 4 个空格,可以有多行,最后用空行结束此标记。

Warning

这是一条采用默认标题的警告信息。

这是一条不带标题的警告信息。

嵌套链接及引用块

欢迎访问我的博客链接:悟尘纪

这里嵌套一行引用信息。

嵌套链接及引用块

嵌套admonition

嵌套admonition

子内容

如果 $k \leq r$

标题为公式,内容公式\(k \leq r\)

所有功能

Note

Abstract

Info

Tip

Success

Question

Todo

Warning

Failure

Danger

Bug

Example

Quote

Attention

Caution

Missing

Error

wavedrom

外部图片链接

wave

kroki画图

1
2
3
4
5
#使用语法
```language {kroki=true}
code
code
```

Table中插入wavedrom

当前渲染使用的pandoc版本为3.3

符号 含义 样例 渲染结果
. 与上一周期状态相同 { signal : [{ name: ".", wave: "p..." }]}

test

p 在周期开始时为上升沿的时钟信号 { signal : [{ name: ".", wave: "p.pp" }]} a link
P 在周期开始时为上升沿的时钟信号,上升沿有箭头 { signal : [{ name: ".", wave: "P.PP" }]} one
n 在周期开始时为下降沿的时钟信号 { signal : [{ name: ".", wave: "n.nn" }]} n
N 在周期开始时为下降沿的时钟信号,下降沿有箭头 { signal : [{ name: ".", wave: "N.NN" }]} N
0 低电平,有过渡 { signal : [{ name: ".", wave: "0.01" }]} 0
l 低电平,无过渡 { signal : [{ name: ".", wave: "l.lh" }]} l
1 高电平,有过渡 { signal : [{ name: ".", wave: "1.10" }]} 1
h 高电平,无过渡 { signal : [{ name: ".", wave: "h.hl" }]} h
z 高阻态 { signal : [{ name: ".", wave: "z.zz" }]} z
d 下拉(弱 0) { signal : [{ name: ".", wave: "d.dd" }]} d
u 上拉(弱 1) { signal : [{ name: ".", wave: "u.uu" }]} u
x 未定义 { signal : [{ name: ".", wave: "x.xx" }]} x
2/= 值(颜色为 2) { signal : [{ name: "2", wave: "2.22" }]} 2
3 值(颜色为 3) { signal : [{ name: "3", wave: "3.33" }]} 3
4/5/6 值(颜色为 4/5/6) { signal : [{ name: "4/5/6", wave: "4.56" }]} 4/5/6
7/8/9 值(颜色为 7/8/9) { signal : [{ name: "7/8/9", wave: "7.89" }]} 7/8/9
| 延长前一个周期并绘制间隙 { signal : [{ name: "|", wave: "xx|x" }]} |

pseudocode

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
```pseudocode
% This quicksort algorithm is extracted from Chapter 7, Introduction to Algorithms (3rd edition)
\begin{algorithm}
\caption{Quicksort}
\begin{algorithmic}
\PROCEDURE{Quicksort}{$A, p, r$}
\IF{$p < r$}
\STATE $q = $ \CALL{Partition}{$A, p, r$}
\STATE \CALL{Quicksort}{$A, p, q - 1$}
\STATE \CALL{Quicksort}{$A, q + 1, r$}
\ENDIF
\ENDPROCEDURE
\PROCEDURE{Partition}{$A, p, r$}
\STATE $x = A[r]$
\STATE $i = p - 1$
\FOR{$j = p$ \TO $r - 1$}
\IF{$A[j] < x$}
\STATE $i = i + 1$
\STATE exchange
$A[i]$ with $A[j]$
\ENDIF
\STATE exchange $A[i]$ with $A[r]$
\ENDFOR
\ENDPROCEDURE
\end{algorithmic}
\end{algorithm}
```
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
% This quicksort algorithm is extracted from Chapter 7, Introduction to Algorithms (3rd edition)
\begin{algorithm}
\caption{Quicksort}
\begin{algorithmic}
\PROCEDURE{Quicksort}{$A, p, r$}
\IF{$p < r$}
\STATE $q = $ \CALL{Partition}{$A, p, r$}
\STATE \CALL{Quicksort}{$A, p, q - 1$}
\STATE \CALL{Quicksort}{$A, q + 1, r$}
\ENDIF
\ENDPROCEDURE
\PROCEDURE{Partition}{$A, p, r$}
\STATE $x = A[r]$
\STATE $i = p - 1$
\FOR{$j = p$ \TO $r - 1$}
\IF{$A[j] < x$}
\STATE $i = i + 1$
\STATE exchange
$A[i]$ with $A[j]$
\ENDIF
\STATE exchange $A[i]$ with $A[r]$
\ENDFOR
\ENDPROCEDURE
\end{algorithmic}
\end{algorithm}
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
<pre id="quicksort" class="pseudocode">
% This quicksort algorithm is extracted from Chapter 7, Introduction to Algorithms (3rd edition)
\begin{algorithm}
\caption{Quicksort}
\begin{algorithmic}
\PROCEDURE{Quicksort}{$A, p, r$}
\IF{$p < r$}
\STATE $q = $ \CALL{Partition}{$A, p, r$}
\STATE \CALL{Quicksort}{$A, p, q - 1$}
\STATE \CALL{Quicksort}{$A, q + 1, r$}
\ENDIF
\ENDPROCEDURE
\PROCEDURE{Partition}{$A, p, r$}
\STATE $x = A[r]$
\STATE $i = p - 1$
\FOR{$j = p$ \TO $r - 1$}
\IF{$A[j] < x$}
\STATE $i = i + 1$
\STATE exchange
$A[i]$ with $A[j]$
\ENDIF
\STATE exchange $A[i]$ with $A[r]$
\ENDFOR
\ENDPROCEDURE
\end{algorithmic}
\end{algorithm}
</pre>
    % This quicksort algorithm is extracted from Chapter 7, Introduction to Algorithms (3rd edition)
    \begin{algorithm}
    \caption{Quicksort}
    \begin{algorithmic}
    \PROCEDURE{Quicksort}{$A, p, r$}
        \IF{$p < r$} 
            \STATE $q = $ \CALL{Partition}{$A, p, r$}
            \STATE \CALL{Quicksort}{$A, p, q - 1$}
            \STATE \CALL{Quicksort}{$A, q + 1, r$}
        \ENDIF
    \ENDPROCEDURE
    \PROCEDURE{Partition}{$A, p, r$}
        \STATE $x = A[r]$
        \STATE $i = p - 1$
        \FOR{$j = p$ \TO $r - 1$}
            \IF{$A[j] < x$}
                \STATE $i = i + 1$
                \STATE exchange
                $A[i]$ with $A[j]$
            \ENDIF
            \STATE exchange $A[i]$ with $A[r]$
        \ENDFOR
    \ENDPROCEDURE
    \end{algorithmic}
    \end{algorithm}

交叉引用

引用与打标签的语法需要安装pandoc-crossref,表格标题的语法不需要

参考链接

原则上,在添加标签的时候,{#之间是不需要空格的,但是由于hexo的问题,如果不加空格的话,会导致其截断后面的内容({ and # without space is interpreted as a comment of the nunjucks template by Hexo),可以通过在博客的Front-matter中添加disableNunjucks: true来解决这个问题,但是添加了这个之后,很多插件就失效了。因此比较好的方案是使用<span id="HTML-anchor"></span>来添加标签

图片交叉引用

fig ref

1
2
3
4
5
创建标签语法
![fig Caption](link){#fig:label}

引用语法
[fig ref](#fig:label)

fig

表格交叉引用

Caption
a b c
1 2 3
4 5 6

下面Caption上的那个空行不能少

table ref

1
2
3
4
5
6
7
8
9
创建标签语法
a b c
--- --- ---
1 2 3
4 5 6

: Caption {#tbl:label}

引用标签语法[text](#tbl:label)
Caption { #tbl:label)}
a b c
1 2 3
4 5 6

公式交叉引用

math ref

1
$$ math $$ {#eq:label}

\[ math \] { #eq:label}

\[\cssId{Overlinev}{\overline{v}}:\overline{S}\to\{F,T\}\]

test公式ref

代码块交叉引用

code ref

1
2
3
4
5
6
```haskell
main :: IO ()
main = putStrLn "Hello World!"
```

: Listing caption {#lst:code}
1
2
main :: IO ()
main = putStrLn "Hello World!"

: Listing caption { #lst:code}


  1. 脚注测试↩︎

  2. english↩︎