随便写点什么吧

1️⃣基本使用

💭表达类标签

emoji表情包

1
2
3
4
5
{% emoji 蛋糕 %}
{% emoji twemoji 1f634 %}
{% emoji qq 咖啡 %}
{% emoji tieba 礼物 height:2em %}
{% emoji blobcat blobcatheartpride height:3em %}

icon 图标标签

可以在任意位置插入图标:

1
2
3
4
5
6
7
8
9
可以在任意位置插入图标:{% icon octopus:32 %}

{% icon octopus:32 color:red %}
{% icon octopus:32 color:orange %}
{% icon octopus:32 color:yellow %}
{% icon octopus:32 color:green %}
{% icon octopus:32 color:cyan %}
{% icon octopus:32 color:blue %}
{% icon octopus:32 color:purple %}

mark 标记

默认 绿 警告 错误
1
2
3
4
5
6
7
8
9
10
11
12
{% mark 默认 %} 
{% mark 红 color:red %}
{% mark 橙 color:orange %}
{% mark 黄 color:yellow %}
{% mark 绿 color:green %}
{% mark 青 color:cyan %}
{% mark 蓝 color:blue %}
{% mark 紫 color:purple %}
{% mark 亮 color:light %}
{% mark 暗 color:dark %}
{% mark 警告 color:warning %}
{% mark 错误 color:error %}

hashtag 标签

Stellar Hexo GitHub
1
2
3
{% hashtag Stellar https://xaoxuu.com/wiki/stellar/ %}
{% hashtag Hexo https://hexo.io/ color:blue %}
{% hashtag GitHub https://github.com/xaoxuu/ color:dark %}

image 图片标签

1
{% image src [description] [download:bool/string] [width:px] [padding:px] [bg:hex] [fancybox:bool/string] %}
参数说明
1
2
3
4
5
6
7
src: 图片地址
description: 图片描述
download: href # 下载地址,设置此值后鼠标放在图片上会显示下载地址,如果下载地址为图片地址,可以设置为 true
width: 200px # 图片宽度
padding: 16px # 图片四周填充宽度
bg: '#ffffff' # 图片区域背景颜色,16进制
fancybox: href # fancybox 放大地址,设置此值后会调用该链接放大,如果放大地址为图片地址,可以设置为 true

横向铺满图片

猫猫镇楼
猫猫镇楼
1
{% image /images/base/test.jpg 猫猫镇楼 download:true fancybox:true %}

竖图(小图)优化

猫猫镇楼
猫猫镇楼
1
{% image /images/base/test2.jpg 猫猫镇楼 width:300px padding:10px bg:var(--card) download:true fancybox:true %}

quote 引用

居中引用

1
{% quot 居中引用 %}

自定义配置

1
{% quot 自定义配置 icon:coffee %}

也可以指定任意图标

1
{% quot 也可以指定任意图标 prefix:cat-head:64 suffix:dog-head:64 %}

特别引用

1
{% quot 特别引用 el:h4 icon:talk %}

poetry 诗词

黑客也是创造者,与画家、建筑师、作家一样
保罗·格雷厄姆

黑客搞懂 “计算理论”(theory of computation)的必要性,
与画家搞懂颜料化学成分的必要性差不多大。

1
2
3
4
{% poetry 黑客也是创造者,与画家、建筑师、作家一样 author:保罗·格雷厄姆 footer:《黑客与画家》节选 %}
黑客搞懂 **“计算理论”**(theory of computation)的必要性,
与画家搞懂颜料化学成分的必要性差不多大。
{% endpoetry %}

paper 纸张标签

《忏悔录》节选

第二章

这话不是根据我自己的经验,而是根据我的观察,因为我知道自己的经验是完全不适于别人的。

第三章

可是我无论怎样用功,进步还是很小。说起来真是奇怪,我虽然也有相当的理解能力,我却从来不能从老师那里——父亲和朗拜尔西埃先生是例外——学到什么东西。
我另外的一些知识,都是我自学来的,这个以后就会清楚的。我那不能忍受任何束缚的思想不肯服从时间的限制;担心学不会的心情妨碍着我专心听讲:
生怕由于自己不懂而让教我的人着急的心情促使我装懂,教的人一直往下教,我却什么也不懂。我想按自己的步调行动,不愿顺从别人的步调。

1
2
3
4
5
6
7
8
9
10
11
12
{% paper style:underline title:《忏悔录》节选 author:卢梭 date:《忏悔录》 footer:第二、三章节选 %}
<!-- line left -->
第二章
<!-- paragraph -->
这话不是根据我自己的经验,而是根据我的观察,因为我知道自己的经验是完全不适于别人的。
<!-- line right -->
第三章
<!-- paragraph -->
可是我无论怎样用功,进步还是很小。说起来真是奇怪,我虽然也有相当的理解能力,我却从来不能从老师那里——父亲和朗拜尔西埃先生是例外——学到什么东西。
我另外的一些知识,都是我自学来的,这个以后就会清楚的。我那不能忍受任何束缚的思想不肯服从时间的限制;担心学不会的心情妨碍着我专心听讲:
生怕由于自己不懂而让教我的人着急的心情促使我装懂,教的人一直往下教,我却什么也不懂。**我想按自己的步调行动,不愿顺从别人的步调。**
{% endpaper %}
  • style:underline | 无,是否带下划线
  • title:标题
  • author:作者
  • date:日期
  • footer:页脚
正文可设置段落格式
1
2
3
4
5
6
7
8
<!-- section 小节标题 -->
小节标题,居中显示
<!-- paragraph -->
段落,首行缩进两个字符
<!-- line left -->
段落左对齐
<!-- line right -->
段落右对齐

reel 卷轴标签

南陵别儿童入京
李白

白酒新熟山中归,黄鸡啄黍秋正肥。
呼童烹鸡酌白酒,儿女嬉笑牵人衣。
高歌取醉欲自慰,起舞落日争光辉。
游说万乘苦不早,著鞭跨马涉远道。
会稽愚妇轻买臣,余亦辞家西入秦。
仰天大笑出门去,我辈岂是蓬蒿人。

全唐诗
1
2
3
4
5
6
7
8
{% reel 南陵别儿童入京 author:李白 date:全唐诗 footer:节选 %}
白酒新熟山中归,黄鸡啄黍秋正肥。
呼童烹鸡酌白酒,儿女嬉笑牵人衣。
高歌取醉欲自慰,起舞落日争光辉。
游说万乘苦不早,著鞭跨马涉远道。
会稽愚妇轻买臣,余亦辞家西入秦。
仰天大笑出门去,我辈岂是蓬蒿人。
{% endreel %}

note 备注块

备注标题

备注内容

1
2
- color: red、orange、amber、yellow、green、cyan、blue、purple、light、dark、warning、error
{% note 备注标题 备注内容 [color:color] %}
1
{% link href [title] [icon:src] [desc:true/false] %}

button 按钮

文档 探索
1
2
3
4
- size: 默认 | xs(最小号)
{% button text url [icon:key/src] [color:color] [size:xs] %}
{% button 文档 /wiki icon:solar:notebook-bookmark-bold-duotone %}
{% button 探索 /explore icon:solar:planet-bold-duotone size:xs %}

okr 目标管理

  • okr:Objectives and Key Results
O1
2025年小目标:全球旅行✈️

从家门口的小公园开始吧

正常 44%
KR1
重构 tag-plugins 和 wiki 系统
  • KR 进度为 100% 时,标签默认显示为 已完成
  • KR 未设置进度时,默认为 0%
  • O 未设置进度时,则显示所有 KR 进度平均值
已完成 100%
KR2
完成主要页面设计稿

您可以在 _config.yml 文件中修改标签的颜色和文案

您可以在 _config.yml 文件中增加任意的标签配置

延期 90%
KR3
完成前置准备工作
在咸水和海滩之间找一亩地
求出圆周率后15位
找出宇宙的终极逻辑
去地狱里走两步
未完成 -12%
KR-4
开发、测试和发布
风险 0%

copy 复制行

$
1
2
3
4
{% copy curl -s https://sh.xaox.cc/install | sh prefix:$ %}
{% copy git:https xaoxuu.com/hexo-theme-stellar %}
{% copy git:ssh xaoxuu.com/hexo-theme-stellar %}
{% copy git:gh xaoxuu.com/hexo-theme-stellar %}

radio 单选

没有勾选的单选框
已勾选的单选框
没有勾选的单选框
已勾选的单选框
1
2
{% radio 没有勾选的单选框 %}
{% radio checked:true 已勾选的单选框 %}
  • checked:true | false
  • color:颜色

checkbox 复选

普通的没有勾选的复选框
普通的已勾选的复选框
显示为加号的绿色的已勾选的复选框
显示为减号的黄色的已勾选的复选框
显示为乘号的红色的已勾选的复选框
1
2
3
4
5
{% checkbox 普通的没有勾选的复选框 %}
{% checkbox checked:true 普通的已勾选的复选框 %}
{% checkbox symbol:plus color:green checked:true 显示为加号的绿色的已勾选的复选框 %}
{% checkbox symbol:minus color:yellow checked:true 显示为减号的黄色的已勾选的复选框 %}
{% checkbox symbol:times color:red checked:true 显示为乘号的红色的已勾选的复选框 %}
  • checked:true | false
  • symbol: plus | minus | times
  • color:颜色

audio 音频标签

  • 支持音乐外链和网易云音乐
1
2
3
{% audio https://github.com/volantis-x/volantis-docs/releases/download/assets/Lumia1020.mp3 %}
{% audio netease:4919517 %}
{% audio type:2 netease:4919517 autoplay:0 %}
  • type
    • 2表示歌曲
    • 0表示歌单
  • netease: 歌曲/歌单id,在网易云分享链接中能找到
  • autoplay
    • 1 表示自动播放
    • 0 表示手动播放

video 视频标签

1
2
3
4
5
{% video bilibili:BV1x44y1K7ho %}
{% video youtube:FDUk0Kcte9A %}

- width: 500px # 单位 80% 20em 100mm
- autoplay: 1/0 # 1:自动播放 0:手动播放
1
2
- 由链接组成的导航栏
{% navbar active:/wiki/ [文章](/) [项目](/wiki/) [留言](#comments) [GitHub](https://github.com/xaoxuu/) %}

frame 设备框架

1
{% frame iphone11 img:/assets/wiki/prohud/toast/demo-loading.png video:/assets/wiki/prohud/toast/demo-loading.mp4 focus:top %}

文本修饰标签集

  • 这是 密码 标签
  • 这是 下划线 标签
  • 这是 着重号 标签
  • 这是 波浪线 标签
  • 这是 删除线 标签
  • 这是 上角标 标签
  • 这是 下角标 标签
  • 这是 键盘样式 标签,试一试: + D
1
2
3
4
5
6
7
8
- 这是 {% psw 密码 %} 标签
- 这是 {% u 下划线 %} 标签
- 这是 {% emp 着重号 %} 标签
- 这是 {% wavy 波浪线 %} 标签
- 这是 {% del 删除线 %} 标签
- 这是 {% sup 上角标 color:red %} 标签
- 这是 {% sub 下角标 %} 标签
- 这是 {% kbd 键盘样式 %} 标签,试一试:{% kbd ⌘ %} + {% kbd D %}

🔢数据类标签

timeline 时间线

2025 年 2 月 25 日

今天科三考试最后熄火,还好我平时练车熄火太多所以很熟,回空挡打火换一档完成靠边停车,贴着及格线过了,激动的心颤抖的手

2025 年 2 月 24 日

下午科目三模拟3把连挂,教练差点气撅过去

1
2
3
4
5
6
7
8
{% timeline %}
<!-- node 2025 年 2 月 25 日 -->
今天科三考试最后熄火,还好我平时练车熄火太多所以很熟,回空挡打火换一档完成靠边停车,贴着及格线过了,激动的心颤抖的手
{% image /images/meme/idrive.jpg width:300px %}
<!-- node 2025 年 2 月 24 日 -->
下午科目三模拟3把连挂,教练差点气撅过去
{% image /images/meme/acat.jpg width:200px %}
{% endtimeline %}

动态时间线参考

friends 友链

/source/_data/links/exm_blogs.yml
1
2
3
4
5
- title: 明眸如初
url: https://www.zywvvd.com/
cover:
icon: https://www.zywvvd.com/image/avatar.png
description: Hexo-Butterfly搭建,访问统计的3d模型非常炫酷
1
{% friends exm_blogs %}

sites 网站卡片

/source/_data/links/sites_design.yml
1
2
3
4
5
- title: unsplash
url: https://unsplash.com/
cover: /images/site/unsplash.png
icon: https://unsplash.com/favicon.ico
description: 高质量图片分享平台
1
{% sites sites_design %}

ghcard 卡片

1
2
{% ghcard puyixiu theme:dark %}
{% ghcard PUYIXIU/ashihachi-stellar-blog theme:dark %}

📦容器类标签

box 盒子容器

1
2
{% box [title] [color:color] [child:codeblock/tabs] %}
{% endbox %}
参数说明
1
2
3
title: 标题
color: red/orange/yellow/green/cyan/blue/purple/light/dark
child: codeblock | tabs

folding 折叠容器

展开详情
1
2
3
{% folding title [codeblock:bool] [open:bool] [color:color] %}
content
{% endfolding %}
参数说明
1
2
3
codeblock: true | false
open: true | false
color: red/orange/yellow/green/cyan/blue/purple/light/dark

folders 聚合折叠容器

抽屉A

这个抽屉是空的

抽屉B

这个抽屉是空的

抽屉C

找到了一把手电筒

1
2
3
4
5
6
7
8
{% folders %}
<!-- folder 抽屉A -->
这个抽屉是空的
<!-- folder 抽屉B -->
这个抽屉是空的
<!-- folder 抽屉C -->
找到了一把手电筒
{% endfolders %}

tabs 分栏容器

1
2
let x = 123
console.log("Hello World")
a b c
a1 b1 c1
a2 b2 c2
1
2
3
4
5
6
7
8
9
10
11
12
13
{% tabs active:2 align:center %}
<!-- tab 图片 -->
{% image /images/base/test.jpg width:300px %}

<!-- tab 代码块 -->
content

<!-- tab 表格 -->
| a | b | c |
| --- | --- | --- |
| a1 | b1 | c1 |
| a2 | b2 | c2 |
{% endtabs %}
参数配置
1
2
align: center
active: 激活标签

grid 网格分区

动态列数

默认布局
1
2
3
1列: 240px - 480px
2列: 480px - 720px
3列: >720px

龟山汉墓

崖洞墓是在石山中开凿墓室的一种墓葬形制,地下空间的布置虽然比较自由,但都最大限度象征和模仿了地上生活的内容。目前所知的汉代诸侯王崖洞墓分布在江苏徐州、河北满城等地,共有三十多座。

主要集中于黄淮之间的东部地区。徐州北洞山汉墓和狮子山汉墓就是西汉前期的两座大型楚王崖洞墓。

刘注墓原棺室的室顶正好对着山的最高处,真不知道在山里作业的工匠是怎么确定的位置。不过后来因为顶上裂开了,才把棺椁移到现在的墓室里。

1
2
3
4
5
6
{% grid %}
<!-- cell -->
content left
<!-- cell -->
content right
{% endgrid %}
参数配置
1
2
3
4
5
w: 一列的宽度
c: 固定列数
bg: box | card
gap: 每列之间的间距,默认16px
br: 圆角半径

固定列数

1
2
3
{% grid c:2 %}
...
{% endgrid %}

背景样式

cell 1

cell 2

cell 3

cell 4

cell 1

cell 2

cell 3

cell 4

1
2
3
4
5
6
7
8
{% gallery %}
![@tianhao_wang](https://images.unsplash.com/photo-1688142202243-e218ad203952?w=800&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHx0b3BpYy1mZWVkfDYzfEZ6bzN6dU9ITjZ3fHxlbnwwfHx8fHw%3D)
![@eberhard](https://images.unsplash.com/photo-1700994630045-f7a20df6d92e?w=800&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwcm9maWxlLXBhZ2V8MjN8fHxlbnwwfHx8fHw%3D)
![@eberhard](https://images.unsplash.com/photo-1533274221104-015a584a1005?w=800&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHx0b3BpYy1mZWVkfDE4fGJvOGpRS1RhRTBZfHxlbnwwfHx8fHw%3D)
![@eberhard](https://images.unsplash.com/photo-1539604214100-ab860d9082e0?w=800&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHx0b3BpYy1mZWVkfDIxfGJvOGpRS1RhRTBZfHxlbnwwfHx8fHw%3D)
![@eberhard](https://images.unsplash.com/photo-1698843848092-588f9c1bb0bd?w=800&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwcm9maWxlLXBhZ2V8Mzh8fHxlbnwwfHx8fHw%3D)
![@vklemen](https://images.unsplash.com/photo-1516571748831-5d81767b788d?q=80&w=2574&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D)
{% endgallery %}
参数配置
1
2
3
bg: 背景
avatar: 头像
link: 跳转链接

独立页面

1
2
3
{% banner 随记 bg:/images/covers/coffee1.jpg %}
{% navbar active:/notes/ [随记](/notes/) [收藏](/bookmark/) %}
{% endbanner %}

用户资料页

1
2
{% banner 足八桑 八条腿各有想法 bg:/images/covers/pixel_universe.png avatar:/images/base/avatar.png %}
{% endbanner %}

swiper 轮播容器

1
2
3
4
5
6
{% swiper effect:cards %}
![](https://images.unsplash.com/photo-1625171515821-1870deb2743b?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=774&q=80)
![](https://images.unsplash.com/photo-1528283648649-33347faa5d9e?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=774&q=80)
![](https://images.unsplash.com/photo-1542272201-b1ca555f8505?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=774&q=80)
![](https://images.unsplash.com/photo-1524797905120-92940d3a18d6?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=774&q=80)
{% endswiper %}
参数配置
1
2
effect: cards | coverflow
width: min | max