Repository navigation
Expand file tree
/
Copy pathsearch.xml
More file actions
90 lines (45 loc) · 331 KB
/
Copy pathsearch.xml
File metadata and controls
90 lines (45 loc) · 331 KB
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
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
<?xml version="1.0" encoding="utf-8"?>
<search>
<entry>
<title>Hello World</title>
<link href="/posts/4a17b156.html"/>
<url>/posts/4a17b156.html</url>
<content type="html"><![CDATA[<p>Welcome to <a href="https://hexo.io/">Hexo</a>! This is your very first post. Check <a href="https://hexo.io/docs/">documentation</a> for more info. If you get any problems when using Hexo, you can find the answer in <a href="https://hexo.io/docs/troubleshooting.html">troubleshooting</a> or you can ask me on <a href="https://github.com/hexojs/hexo/issues">GitHub</a>.</p><h2 id="Quick-Start"><a href="#Quick-Start" class="headerlink" title="Quick Start"></a>Quick Start</h2><h3 id="Create-a-new-post"><a href="#Create-a-new-post" class="headerlink" title="Create a new post"></a>Create a new post</h3><figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">$ hexo new <span class="string">"My New Post"</span></span><br></pre></td></tr></table></figure><p>More info: <a href="https://hexo.io/docs/writing.html">Writing</a></p><h3 id="Run-server"><a href="#Run-server" class="headerlink" title="Run server"></a>Run server</h3><figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">$ hexo server</span><br></pre></td></tr></table></figure><p>More info: <a href="https://hexo.io/docs/server.html">Server</a></p><h3 id="Generate-static-files"><a href="#Generate-static-files" class="headerlink" title="Generate static files"></a>Generate static files</h3><figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">$ hexo generate</span><br></pre></td></tr></table></figure><p>More info: <a href="https://hexo.io/docs/generating.html">Generating</a></p><h3 id="Deploy-to-remote-sites"><a href="#Deploy-to-remote-sites" class="headerlink" title="Deploy to remote sites"></a>Deploy to remote sites</h3><figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">$ hexo deploy</span><br></pre></td></tr></table></figure><p>More info: <a href="https://hexo.io/docs/one-command-deployment.html">Deployment</a></p>]]></content>
</entry>
<entry>
<title>基于Butterfly的外挂标签引入</title>
<link href="/posts/615e2dec.html"/>
<url>/posts/615e2dec.html</url>
<content type="html"><![CDATA[<div class="tip home"><p>本文档为<a href="https://jq.qq.com/?_wv=1027&k=EF1Elvqp">🧊Akilarの糖果屋🍭</a>出品,转载需注明出处。</p><p>如有使用了本站的外挂标签插件的读者,请确保自己的配置内容为最新。</p><p>同理,若您在使用本帖教程后,发现样式无法完全还原文档内效果,请重点排查您的其余第三方魔改css样式,例如css中是否存在<strong>circle</strong>、<strong>square</strong>等易重class名。</p></div><details class="folding-tag" red><summary> 点开查看开发记录 </summary> <div class='content'> <div class="note blue icon-padding modern"><i class="note-icon fas fa-bullhorn"></i><p>本文所涉及的样式,主要参考的是各类已有主题,并对相应styl文件进行样式修改以及添加夜间模式适配。已尽可能追根溯源找到了各部分魔改内容最初的作者,如有错误和遗漏还请联系我修改。</p></div><div class="timeline green"><div class='timeline-item headline'><div class='timeline-item-title'><div class='item-circle'><p>开发记录</p></div></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2022-04-29:发布插件版v1.0.17</p></div></div><div class='timeline-item-content'><ol><li>在bubble气泡外挂标签基础上新增reference引用文献标签</li><li>修复了bubble气泡外挂标签层级过高遮挡提示框的bug</li></ol></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2022-04-28:发布插件版v1.0.16</p></div></div><div class='timeline-item-content'><ol><li>移除timeline外挂标签,请使用butterfly新版自带的timeline标签,效果更好。</li><li>修复tip标签自定义图标无效的bug</li></ol></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2022-04-07:发布插件版v1.0.15</p></div></div><div class='timeline-item-content'><ol><li>调整气泡显隐动画逻辑,避免透明度变换瞬间遮挡到正文。</li></ol></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2022-04-07:发布插件版v1.0.14</p></div></div><div class='timeline-item-content'><ol><li>新增气泡注释bubble标签样式。效果比nota标签更好。</li><li>支持自定义气泡背景色。</li></ol></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2022-03-03:发布插件版v1.0.13</p></div></div><div class='timeline-item-content'><ol><li>新增开关逻辑,iconfont,carousel设为false则不引入。</li><li>site标签新增灯箱屏蔽,不再支持点击放大图片。</li></ol></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2022-02-14:发布插件版v1.0.12</p></div></div><div class='timeline-item-content'><ol><li>剔除了link卡片的无效css</li></ol></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2022-01-26:发布插件版v1.0.11</p></div></div><div class='timeline-item-content'><ol><li>butterfly_v4.0新增了<code>timeline</code>标签,与本插件标签名冲突。可以选择改用标签文档中的源码配置方案并剔除timeline标签或者删除主题原有的timeline标签文件<code>Blogroot\themes\butterfly\scripts\tag\timeline.js</code>和<code>Blogroot\themes\butterfly\source\css\_tags\timeline.styl</code>。(总之不能共存)</li><li>修复了carousel标签刷新后不加载的bug。</li></ol></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2021-12-23:发布插件版v1.0.10</p></div></div><div class='timeline-item-content'><ol><li>将所有CDN链接迁移至<code>unpkg.zhimg.com</code></li><li>外露所有CDN配置项,支持读者自行更改CDN源</li></ol></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2021-12-09:发布插件版v1.0.9</p></div></div><div class='timeline-item-content'><ol><li>调整<code>link</code>标签的默认图片缺省值适配,新增<code>tag_plugins.link.placeholder</code>配置项。</li><li>因为新增了默认图片,新增配置项,所以需要更新版本。如果本身使用link标签就有自己加图片的习惯的,无需升级。<figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">npm install hexo-butterfly-tag-plugins-plus@1.0.9 --save</span><br></pre></td></tr></table></figure></li></ol></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2021-12-07:发布插件版v1.0.5</p></div></div><div class='timeline-item-content'><ol><li>调整<code>folding</code>标签,解决与twikoo设置面板样式的冲突问题</li><li>因为调整了<code>folding</code>标签的编译函数,低版本会出现folding样式失效的情况,请各位更新至最新版本。<figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">npm install hexo-butterfly-tag-plugins-plus@1.0.5 --save</span><br></pre></td></tr></table></figure></li></ol></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2021-12-01:发布插件版v1.0.4</p></div></div><div class='timeline-item-content'><ol><li>调整<code>tip</code>标签,字体垂直居中</li></ol></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2021-08-06:发布插件版v1.0.3</p></div></div><div class='timeline-item-content'><ol><li>新增<code>carousel</code>旋转相册</li></ol></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2021-07-07:发布插件版v1.0.0</p></div></div><div class='timeline-item-content'><ol><li>使用npm插件安装。</li><li>测试版本为butterfly_v3.1.0、3.3.0、3.7.8、3.8.0</li><li>插件写法调整为高内聚,理论上不受butterfly主题版本影响。</li><li>为了获得完整效果,建议打开主题的beautify配置项和theme_color配置项。</li></ol></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2021-03-19:正式版v1.61</p></div></div><div class='timeline-item-content'><ol><li>修复行内图片换行错误。</li></ol></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2021-02-24:正式版v1.6</p></div></div><div class='timeline-item-content'><ol><li>新增一个样式标签,进度条progress</li></ol></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2020-12-31:正式版v1.5</p></div></div><div class='timeline-item-content'><ol><li>新增两个样式标签,github徽标ghbdage和特效标签wow</li><li>移除静态资源中的<code>fontawesome-animation.min.css</code>以及<code>issues.js</code>,改为CDN引用。</li><li>本帖不专门提供特效标签wow的配置方案,若有需要,请查看站内教程<a href="/posts/abab51cf/">使用wowjs给博客添加动画效果</a></li></ol></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2020-12-17:正式版v1.4</p></div></div><div class='timeline-item-content'><ol><li>新增两个样式标签poem和icon</li><li>修复了folding标签嵌套字体逐级放大的bug。</li><li>不再更新v3.4.0以下版本的适配内容。</li></ol></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2020-12-13:正式版v1.3</p></div></div><div class='timeline-item-content'><ol><li>新增Butterfly_v3.4.0的配置文件。</li><li>请读者根据自己的主题版本选择替换。</li></ol></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2020-12-07:正式版v1.21</p></div></div><div class='timeline-item-content'><ol><li>资源文件无任何改动。</li><li>更新了动态标签的使用说明。补全参数配置,更换示例。使得教程更加通俗易懂。</li></ol></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2020-12-03:正式版v1.2</p></div></div><div class='timeline-item-content'><ol><li>新增当初弃用的issues.js标签,以配合友链魔改教程中的issues自动更新功能。</li><li>更新了静态资源文件,请之前的读者重新覆盖安装。</li><li>修改了<code>fontawesome-animation.min.css</code>的引入方式,改成使用<code>@import</code>注入<code>index.css</code>。</li></ol></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2020-11-16:正式版v1.1</p></div></div><div class='timeline-item-content'><ol><li>新增tip.js,将小康大佬的渐变色上标标签写法从HTML的方式改成用标签语法编写。</li><li>新增动态标签样式anima,使用了fontawesome-animation项目。</li><li>新增标签内容夜间模式适配。</li></ol></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2020-11-15:正式版v1.0</p></div></div><div class='timeline-item-content'><ol><li>基本完成Volantis外挂标签移植。</li><li>移除了btn标签,因为存在冲突。而且不如butterfly自带的button样式好看。</li><li>适配了folding标签的夜间模式。</li><li>打包了静态资源文件,上传蓝奏云。</li></ol></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2020-11-14:内测版v0.05</p></div></div><div class='timeline-item-content'><ol><li>主要使用了<a href="https://github.com/volantis-x/hexo-theme-volantis">Volantis</a>的标签样式。引入<code>[tag].js</code>,并针对<code>butterfly</code>主题修改了相应的<code>[tag].styl</code>。在此鸣谢<code>Volantis</code>主题众开发者。</li><li>主要参考内容<ul><li><a href="https://volantis.js.org/tag-plugins/">Volantis文档:内置标签插件</a></li><li><a href="https://butterfly.js.org/posts/4aa8abbe/#%E6%A8%99%E7%B1%A4%E5%A4%96%E6%8E%9B%EF%BC%88Tag-Plugins%EF%BC%89">Butterfly 安装文档:标签外挂(Tag Plugins)</a></li><li><a href="https://lovelijunyi.gitee.io/posts/c898.html">小弋の生活馆全样式预览</a></li><li><a href="https://github.com/l-lin/font-awesome-animation">l-lin-font-awesome-animation</a></li><li><a href="https://www.antmoe.com/posts/3b43914f/">小康的butterfly主题使用文档</a></li></ul></li></ol></div></div></div> </div> </details><div class="tabs" id="配置方案"><ul class="nav-tabs"><li class="tab active"><button type="button" data-href="#配置方案-1">npm插件安装方案(推荐)</button></li><li class="tab"><button type="button" data-href="#配置方案-2">源码修改配置方案</button></li></ul><div class="tab-contents"><div class="tab-item-content active" id="配置方案-1"><ol><li>安装插件,在博客根目录<code>[Blogroot]</code>下打开终端,运行以下指令:<figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">npm install hexo-butterfly-tag-plugins-plus --save</span><br></pre></td></tr></table></figure>考虑到hexo自带的markdown渲染插件<code>hexo-renderer-marked</code>与外挂标签语法的兼容性较差,建议您将其替换成<a href="https://www.npmjs.com/package/hexo-renderer-kramed">hexo-renderer-kramed</a><figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">npm uninstall hexo-renderer-marked --save</span><br><span class="line">npm install hexo-renderer-kramed --save</span><br></pre></td></tr></table></figure></li><li>添加配置信息,以下为写法示例<br>在站点配置文件<code>_config.yml</code>或者主题配置文件<code>_config.butterfly.yml</code>中添加<figure class="highlight yaml"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment"># tag-plugins-plus</span></span><br><span class="line"><span class="comment"># see https://akilar.top/posts/615e2dec/</span></span><br><span class="line"><span class="attr">tag_plugins:</span></span><br><span class="line"> <span class="attr">enable:</span> <span class="literal">true</span> <span class="comment"># 开关</span></span><br><span class="line"> <span class="attr">priority:</span> <span class="number">5</span> <span class="comment">#过滤器优先权</span></span><br><span class="line"> <span class="attr">issues:</span> <span class="literal">false</span> <span class="comment">#issues标签依赖注入开关</span></span><br><span class="line"> <span class="attr">link:</span></span><br><span class="line"> <span class="attr">placeholder:</span> <span class="string">/img/link.png</span> <span class="comment">#link_card标签默认的图标图片</span></span><br><span class="line"> <span class="attr">CDN:</span></span><br><span class="line"> <span class="attr">anima:</span> <span class="string">https://npm.elemecdn.com/hexo-butterfly-tag-plugins-plus@latest/lib/assets/font-awesome-animation.min.css</span> <span class="comment">#动画标签anima的依赖</span></span><br><span class="line"> <span class="attr">jquery:</span> <span class="string">https://npm.elemecdn.com/jquery@latest/dist/jquery.min.js</span> <span class="comment">#issues标签依赖</span></span><br><span class="line"> <span class="attr">issues:</span> <span class="string">https://npm.elemecdn.com/hexo-butterfly-tag-plugins-plus@latest/lib/assets/issues.js</span> <span class="comment">#issues标签依赖</span></span><br><span class="line"> <span class="attr">iconfont:</span> <span class="string">//at.alicdn.com/t/font_2032782_8d5kxvn09md.js</span> <span class="comment">#参看https://akilar.top/posts/d2ebecef/</span></span><br><span class="line"> <span class="attr">carousel:</span> <span class="string">https://npm.elemecdn.com/hexo-butterfly-tag-plugins-plus@latest/lib/assets/carousel-touch.js</span></span><br><span class="line"> <span class="attr">tag_plugins_css:</span> <span class="string">https://npm.elemecdn.com/hexo-butterfly-tag-plugins-plus@latest/lib/tag_plugins.css</span></span><br></pre></td></tr></table></figure></li><li>参数释义</li></ol><div class="table-container"><table><thead><tr><th style="text-align:left">参数</th><th style="text-align:left">备选值/类型</th><th style="text-align:left">释义</th></tr></thead><tbody><tr><td style="text-align:left">enable</td><td style="text-align:left">true/false</td><td style="text-align:left">【必选】控制开关</td></tr><tr><td style="text-align:left">priority</td><td style="text-align:left">number</td><td style="text-align:left">【可选】过滤器优先级,数值越小,执行越早,默认为10,选填</td></tr><tr><td style="text-align:left">issues</td><td style="text-align:left">true/false</td><td style="text-align:left">【可选】issues标签控制开关,默认为false</td></tr><tr><td style="text-align:left">link.placeholder</td><td style="text-align:left">【必选】link卡片外挂标签的默认图标</td></tr><tr><td style="text-align:left">CDN.anima</td><td style="text-align:left">URL</td><td style="text-align:left">【可选】动画标签anima的依赖</td></tr><tr><td style="text-align:left">CDN.jquery</td><td style="text-align:left">URL</td><td style="text-align:left">【可选】issues标签依赖</td></tr><tr><td style="text-align:left">CDN.issues</td><td style="text-align:left">URL</td><td style="text-align:left">【可选】issues标签依赖</td></tr><tr><td style="text-align:left">CDN.iconfont</td><td style="text-align:left">URL</td><td style="text-align:left">【可选】iconfont标签symbol样式引入,如果不想引入,则设为false</td></tr><tr><td style="text-align:left">CDN.carousel</td><td style="text-align:left">URL</td><td style="text-align:left">【可选】carousel旋转相册标签鼠标拖动依赖,如果不想引入则设为false</td></tr><tr><td style="text-align:left">CDN.tag_plugins_css</td><td style="text-align:left">URL</td><td style="text-align:left">【可选】外挂标签样式的CSS依赖,为避免CDN缓存延迟,建议将@latest改为具体版本号</td></tr></tbody></table></div><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="配置方案-2"><p><div class="tip info"><p>源码修改配置方案适用于不想应用全部外挂标签的用户,供熟悉外挂标签原理的用户自行选择装配需要的标签文件。</p></div></p><ol><li>下载资源文件<br><a class="ghcard" rel="external nofollow noopener noreferrer" href="https://github.com/Akilarlxh/hexo-butterfly-tag-plugins-plus"><img src="https://github-readme-stats.vercel.app/api/pin/?username=Akilarlxh&repo=hexo-butterfly-tag-plugins-plus&theme=vue&show_owner=true"/></a></li><li>将下载的<code>hexo-butterfly-tag-plugins-plus.zip</code>解压得到资源文件夹,下文以<code>[tag_plugins_file]</code>指代该文件夹。</li><li>将<code>[tag_plugins_file]\lib\scripts</code>目录下的文件放到<code>[Blogroot]\themes\butterfly\scripts\tag\</code>文件夹内。</li><li>将<code>[tag_plugins_file]\lib\style</code>目录下的文件放到<code>[Blogroot]\themes\butterfly\source\css\tags\</code>文件夹内。</li><li>修改<code>[Blogroot]\_config.butterfly.yml</code>的<code>inject</code>配置项,添加<code>CDN</code>依赖项。由于<code>issues</code>写入<code>timeline</code>和<code>site-card</code>标签要用到<code>jquery</code>,请务必根据注释指示的版本决定是否添加。<figure class="highlight yml"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><span class="line"><span class="attr">inject:</span></span><br><span class="line"> <span class="attr">head:</span></span><br><span class="line"> <span class="bullet">-</span> <span class="string"><link</span> <span class="string">rel="stylesheet"</span> <span class="string">href="https://cdn.jsdelivr.net/gh/l-lin/font-awesome-animation/dist/font-awesome-animation.min.css"</span> <span class="string">media="defer"</span> <span class="string">onload="this.media='all'"></span> <span class="comment">#动画标签anima的依赖</span></span><br><span class="line"> <span class="bullet">-</span> <span class="string"><script</span> <span class="string">async</span> <span class="string">src="https://npm.elemecdn.com/hexo-butterfly-tag-plugins-plus@latest/lib/carousel-touch.min.js"></script></span> <span class="comment">#carousel相册鼠标动作的依赖</span></span><br><span class="line"> <span class="attr">bottom:</span></span><br><span class="line"> <span class="bullet">-</span> <span class="string"><script</span> <span class="string">defer</span> <span class="string">src="https://npm.elemecdn.com/jquery@latest/dist/jquery.min.js"></script></span></span><br><span class="line"> <span class="comment"># 自butterfly_v3.4.0+开始,主题基本实现去jquery化,需要自己添加引用,请读者根据版本自行决定是否添加这行引用。</span></span><br><span class="line"> <span class="bullet">-</span> <span class="string"><script</span> <span class="string">defer</span> <span class="string">src="https://npm.elemecdn.com/hexo-theme-volantis@latest/source/js/issues.min.js"></script></span></span><br><span class="line"> <span class="comment">#数据集合标签issues的依赖</span></span><br></pre></td></tr></table></figure></li><li>考虑到hexo自带的markdown渲染插件<code>hexo-renderer-marked</code>与外挂标签语法的兼容性较差,建议您将其替换成<a href="https://www.npmjs.com/package/hexo-renderer-kramed">hexo-renderer-kramed</a><figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">npm uninstall hexo-renderer-marked --save</span><br><span class="line">npm install hexo-renderer-kramed --save</span><br></pre></td></tr></table></figure></li><li>外挂标签使用方案请参阅下文。</li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="行内文本样式-text"><a href="#行内文本样式-text" class="headerlink" title="行内文本样式 text"></a>行内文本样式 text</h2><div class="tabs" id="text"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#text-1">标签语法</button></li><li class="tab active"><button type="button" data-href="#text-2">样式预览</button></li><li class="tab"><button type="button" data-href="#text-3">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="text-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line">{% u 文本内容 %}</span><br><span class="line">{% emp 文本内容 %}</span><br><span class="line">{% wavy 文本内容 %}</span><br><span class="line">{% del 文本内容 %}</span><br><span class="line">{% kbd 文本内容 %}</span><br><span class="line">{% psw 文本内容 %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="text-2"><ol><li>带 <u>下划线</u> 的文本</li><li>带 <emp>着重号</emp> 的文本</li><li>带 <wavy>波浪线</wavy> 的文本</li><li>带 <del>删除线</del> 的文本</li><li>键盘样式的文本 <kbd>command</kbd> + <kbd>D</kbd></li><li>密码样式的文本:<psw>这里没有验证码</psw></li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="text-3"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line"><span class="bullet">1.</span> 带 {% u 下划线 %} 的文本</span><br><span class="line"><span class="bullet">2.</span> 带 {% emp 着重号 %} 的文本</span><br><span class="line"><span class="bullet">3.</span> 带 {% wavy 波浪线 %} 的文本</span><br><span class="line"><span class="bullet">4.</span> 带 {% del 删除线 %} 的文本</span><br><span class="line"><span class="bullet">5.</span> 键盘样式的文本 {% kbd command %} + {% kbd D %}</span><br><span class="line"><span class="bullet">6.</span> 密码样式的文本:{% psw 这里没有验证码 %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="行内文本-span"><a href="#行内文本-span" class="headerlink" title="行内文本 span"></a>行内文本 span</h2><div class="tabs" id="span"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#span-1">标签语法</button></li><li class="tab"><button type="button" data-href="#span-2">配置参数</button></li><li class="tab active"><button type="button" data-href="#span-3">样式预览</button></li><li class="tab"><button type="button" data-href="#span-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="span-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% span 样式参数(参数以空格划分), 文本内容 %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="span-2"><ol><li>字体: logo, code</li><li>颜色: <span class='p red'>red</span>,<span class='p yellow'>yellow</span>,<span class='p green'>green</span>,<span class='p cyan'>cyan</span>,<span class='p blue'>blue</span>,<span class='p gray'>gray</span></li><li>大小: small, h4, h3, h2, h1, large, huge, ultra</li><li>对齐方向: left, center, right</li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="span-3"><ul><li>彩色文字<br>在一段话中方便插入各种颜色的标签,包括:<span class='p red'>红色</span>、<span class='p yellow'>黄色</span>、<span class='p green'>绿色</span>、<span class='p cyan'>青色</span>、<span class='p blue'>蓝色</span>、<span class='p gray'>灰色</span>。</li><li>超大号文字<br>文档「开始」页面中的标题部分就是超大号文字。<br><span class='p center logo large'>Volantis</span><br><span class='p center small'>A Wonderful Theme for Hexo</span></li></ul><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="span-4"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line"><span class="bullet">-</span> 彩色文字</span><br><span class="line">在一段话中方便插入各种颜色的标签,包括:{% span red, 红色 %}、{% span yellow, 黄色 %}、{% span green, 绿色 %}、{% span cyan, 青色 %}、{% span blue, 蓝色 %}、{% span gray, 灰色 %}。</span><br><span class="line"><span class="bullet">-</span> 超大号文字</span><br><span class="line">文档「开始」页面中的标题部分就是超大号文字。</span><br><span class="line">{% span center logo large, Volantis %}</span><br><span class="line">{% span center small, A Wonderful Theme for Hexo %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="段落文本-p"><a href="#段落文本-p" class="headerlink" title="段落文本 p"></a>段落文本 p</h2><div class="tabs" id="p"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#p-1">标签语法</button></li><li class="tab"><button type="button" data-href="#p-2">配置参数</button></li><li class="tab active"><button type="button" data-href="#p-3">样式预览</button></li><li class="tab"><button type="button" data-href="#p-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="p-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% p 样式参数(参数以空格划分), 文本内容 %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="p-2"><ol><li>字体: logo, code</li><li>颜色: <span class='p red'>red</span>,<span class='p yellow'>yellow</span>,<span class='p green'>green</span>,<span class='p cyan'>cyan</span>,<span class='p blue'>blue</span>,<span class='p gray'>gray</span></li><li>大小: small, h4, h3, h2, h1, large, huge, ultra</li><li>对齐方向: left, center, right</li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="p-3"><ul><li>彩色文字<br>在一段话中方便插入各种颜色的标签,包括:<p class='p red'>红色</p>、<p class='p yellow'>黄色</p>、<p class='p green'>绿色</p>、<p class='p cyan'>青色</p>、<p class='p blue'>蓝色</p>、<p class='p gray'>灰色</p>。</li><li>超大号文字<br>文档「开始」页面中的标题部分就是超大号文字。<p class='p center logo large'>Volantis</p><p class='p center small'>A Wonderful Theme for Hexo</p></li></ul><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="p-4"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line"><span class="bullet">-</span> 彩色文字</span><br><span class="line">在一段话中方便插入各种颜色的标签,包括:{% p red, 红色 %}、{% p yellow, 黄色 %}、{% p green, 绿色 %}、{% p cyan, 青色 %}、{% p blue, 蓝色 %}、{% p gray, 灰色 %}。</span><br><span class="line"><span class="bullet">-</span> 超大号文字</span><br><span class="line">文档「开始」页面中的标题部分就是超大号文字。</span><br><span class="line">{% p center logo large, Volantis %}</span><br><span class="line">{% p center small, A Wonderful Theme for Hexo %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="引用-note"><a href="#引用-note" class="headerlink" title="引用 note"></a>引用 note</h2><div class="note warning flat"><p>最新版<code>butterfly</code>标签支持引用<code>fontawesome V5</code>图标,效果上已经优于<code>volantis</code>的note标签。故不再额外引入<code>volantis的note样式</code>。<del>做样式适配好麻烦的啊,能偷懒就偷懒吧</del></p></div><div class="note blue icon-padding modern"><i class="note-icon fas fa-bullhorn"></i><p>以下是<code>butterfly</code>主题的note写法。</p></div><div class="tabs" id="note"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#note-1">通用配置</button></li><li class="tab"><button type="button" data-href="#note-2">语法格式</button></li><li class="tab"><button type="button" data-href="#note-3">配置参数</button></li><li class="tab active"><button type="button" data-href="#note-4">样式预览</button></li><li class="tab"><button type="button" data-href="#note-5">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="note-1"><p>修改主题配置文件<br><figure class="highlight yml"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br></pre></td><td class="code"><pre><span class="line"><span class="attr">note:</span></span><br><span class="line"> <span class="comment"># Note tag style values:</span></span><br><span class="line"> <span class="comment"># - simple bs-callout old alert style. Default.</span></span><br><span class="line"> <span class="comment"># - modern bs-callout new (v2-v3) alert style.</span></span><br><span class="line"> <span class="comment"># - flat flat callout style with background, like on Mozilla or StackOverflow.</span></span><br><span class="line"> <span class="comment"># - disabled disable all CSS styles import of note tag.</span></span><br><span class="line"> <span class="attr">style:</span> <span class="string">simple</span></span><br><span class="line"> <span class="attr">icons:</span> <span class="literal">false</span></span><br><span class="line"> <span class="attr">border_radius:</span> <span class="number">3</span></span><br><span class="line"> <span class="comment"># Offset lighter of background in % for modern and flat styles (modern: -12 | 12; flat: -18 | 6).</span></span><br><span class="line"> <span class="comment"># Offset also applied to label tag variables. This option can work with disabled note tag.</span></span><br><span class="line"> <span class="attr">light_bg_offset:</span> <span class="number">0</span></span><br></pre></td></tr></table></figure><br><code>Note</code>标签外挂有两种用法。<code>icons</code>和<code>light_bg_offset</code>只对方法一生效。</p><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="note-2"><details class="folding-tag" cyan><summary> 方法一 </summary> <div class='content'> <figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% note [class] [no-icon] [style] %}</span><br><span class="line">Any content (support inline tags too.io).</span><br><span class="line">{% endnote %}</span><br></pre></td></tr></table></figure> </div> </details><details class="folding-tag" blue><summary> 方法二 </summary> <div class='content'> <figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% note [color] [icon] [style] %}</span><br><span class="line">Any content (support inline tags too.io).</span><br><span class="line">{% endnote %}</span><br></pre></td></tr></table></figure> </div> </details><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="note-3"><details class="folding-tag" cyan><summary> 方法一 </summary> <div class='content'> <div class="table-container"><table><thead><tr><th style="text-align:left">参数</th><th style="text-align:left">用法</th></tr></thead><tbody><tr><td style="text-align:left">class</td><td style="text-align:left">【可选】标识,不同的标识有不同的配色<br>( default / primary / success / info / warning / danger )</td></tr><tr><td style="text-align:left">no-icon</td><td style="text-align:left">【可选】不显示 icon</td></tr><tr><td style="text-align:left">style</td><td style="text-align:left">【可选】可以覆盖配置中的 style<br>(simple/modern/flat/disabled)</td></tr></tbody></table></div> </div> </details><details class="folding-tag" blue><summary> 方法二 </summary> <div class='content'> <div class="table-container"><table><thead><tr><th style="text-align:left">参数</th><th style="text-align:left">用法</th></tr></thead><tbody><tr><td style="text-align:left">class</td><td style="text-align:left">【可选】标识,不同的标识有不同的配色<br>( default / blue / pink / red / purple / orange / green )</td></tr><tr><td style="text-align:left">no-icon</td><td style="text-align:left">【可选】可配置自定义 icon (只支持 fontawesome 图标, 也可以配置 no-icon )</td></tr><tr><td style="text-align:left">style</td><td style="text-align:left">【可选】可以覆盖配置中的 style<br>(simple/modern/flat/disabled)</td></tr></tbody></table></div> </div> </details><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="note-4"><details class="folding-tag" cyan><summary> 方法一 </summary> <div class='content'> <ol><li><p><code>simple</code>样式</p><div class="note simple"><p>默认 提示块标签</p></div><div class="note default simple"><p>default 提示块标签</p></div><div class="note primary simple"><p>primary 提示块标签</p></div><div class="note success simple"><p>success 提示块标签</p></div><div class="note info simple"><p>info 提示块标签</p></div><div class="note warning simple"><p>warning 提示块标签</p></div><div class="note danger simple"><p>danger 提示块标签</p></div></li><li><p><code>modern</code>样式</p><div class="note modern"><p>默认 提示块标签</p></div><div class="note default modern"><p>default 提示块标签</p></div><div class="note primary modern"><p>primary 提示块标签</p></div><div class="note success modern"><p>success 提示块标签</p></div><div class="note info modern"><p>info 提示块标签</p></div><div class="note warning modern"><p>warning 提示块标签</p></div><div class="note danger modern"><p>danger 提示块标签</p></div></li><li><p><code>flat</code>样式</p><div class="note flat"><p>默认 提示块标签</p></div><div class="note default flat"><p>default 提示块标签</p></div><div class="note primary flat"><p>primary 提示块标签</p></div><div class="note success flat"><p>success 提示块标签</p></div><div class="note info flat"><p>info 提示块标签</p></div><div class="note warning flat"><p>warning 提示块标签</p></div><div class="note danger flat"><p>danger 提示块标签</p></div></li><li><p><code>disabled</code>样式</p><div class="note disabled"><p>默认 提示块标签</p></div><div class="note default disabled"><p>default 提示块标签</p></div><div class="note primary disabled"><p>primary 提示块标签</p></div><div class="note success disabled"><p>success 提示块标签</p></div><div class="note info disabled"><p>info 提示块标签</p></div><div class="note warning disabled"><p>warning 提示块标签</p></div><div class="note danger disabled"><p>danger 提示块标签</p></div></li><li><p><code>no-icon</code>样式</p><div class="note no-icon flat"><p>默认 提示块标签</p></div><div class="note default no-icon flat"><p>default 提示块标签</p></div><div class="note primary no-icon flat"><p>primary 提示块标签</p></div><div class="note success no-icon flat"><p>success 提示块标签</p></div><div class="note info no-icon flat"><p>info 提示块标签</p></div><div class="note warning no-icon flat"><p>warning 提示块标签</p></div><div class="note danger no-icon flat"><p>danger 提示块标签</p></div></li></ol> </div> </details><details class="folding-tag" blue><summary> 方法二 </summary> <div class='content'> <ol><li><p>simple样式</p><div class="note icon-padding simple"><i class="note-icon fab fa-cc-visa"></i><p>你是刷 Visa 还是 UnionPay</p></div><div class="note blue icon-padding simple"><i class="note-icon fas fa-bullhorn"></i><p>2021年快到了….</p></div><div class="note pink icon-padding simple"><i class="note-icon fas fa-car-crash"></i><p>小心开车 安全至上</p></div><div class="note red icon-padding simple"><i class="note-icon fas fa-fan"></i><p>这是三片呢?还是四片?</p></div><div class="note orange icon-padding simple"><i class="note-icon fas fa-battery-half"></i><p>你是刷 Visa 还是 UnionPay</p></div><div class="note purple icon-padding simple"><i class="note-icon far fa-hand-scissors"></i><p>剪刀石头布</p></div><div class="note green icon-padding simple"><i class="note-icon fab fa-internet-explorer"></i><p>前端最讨厌的浏览器</p></div></li><li><p>modern样式</p><div class="note icon-padding modern"><i class="note-icon fab fa-cc-visa"></i><p>你是刷 Visa 还是 UnionPay</p></div><div class="note blue icon-padding modern"><i class="note-icon fas fa-bullhorn"></i><p>2021年快到了….</p></div><div class="note pink icon-padding modern"><i class="note-icon fas fa-car-crash"></i><p>小心开车 安全至上</p></div><div class="note red icon-padding modern"><i class="note-icon fas fa-fan"></i><p>这是三片呢?还是四片?</p></div><div class="note orange icon-padding modern"><i class="note-icon fas fa-battery-half"></i><p>你是刷 Visa 还是 UnionPay</p></div><div class="note purple icon-padding modern"><i class="note-icon far fa-hand-scissors"></i><p>剪刀石头布</p></div><div class="note green icon-padding modern"><i class="note-icon fab fa-internet-explorer"></i><p>前端最讨厌的浏览器</p></div></li><li><p>flat样式</p><div class="note icon-padding flat"><i class="note-icon fab fa-cc-visa"></i><p>你是刷 Visa 还是 UnionPay</p></div><div class="note blue icon-padding flat"><i class="note-icon fas fa-bullhorn"></i><p>2021年快到了….</p></div><div class="note pink icon-padding flat"><i class="note-icon fas fa-car-crash"></i><p>小心开车 安全至上</p></div><div class="note red icon-padding flat"><i class="note-icon fas fa-fan"></i><p>这是三片呢?还是四片?</p></div><div class="note orange icon-padding flat"><i class="note-icon fas fa-battery-half"></i><p>你是刷 Visa 还是 UnionPay</p></div><div class="note purple icon-padding flat"><i class="note-icon far fa-hand-scissors"></i><p>剪刀石头布</p></div><div class="note green icon-padding flat"><i class="note-icon fab fa-internet-explorer"></i><p>前端最讨厌的浏览器</p></div></li></ol><ol><li><p>disabled样式</p><div class="note icon-padding disabled"><i class="note-icon fab fa-cc-visa"></i><p>你是刷 Visa 还是 UnionPay</p></div><div class="note blue icon-padding disabled"><i class="note-icon fas fa-bullhorn"></i><p>2021年快到了….</p></div><div class="note pink icon-padding disabled"><i class="note-icon fas fa-car-crash"></i><p>小心开车 安全至上</p></div><div class="note red icon-padding disabled"><i class="note-icon fas fa-fan"></i><p>这是三片呢?还是四片?</p></div><div class="note orange icon-padding disabled"><i class="note-icon fas fa-battery-half"></i><p>你是刷 Visa 还是 UnionPay</p></div><div class="note purple icon-padding disabled"><i class="note-icon far fa-hand-scissors"></i><p>剪刀石头布</p></div><div class="note green icon-padding disabled"><i class="note-icon fab fa-internet-explorer"></i><p>前端最讨厌的浏览器</p></div></li><li><p>no-icon样式</p><div class="note no-icon flat"><p>你是刷 Visa 还是 UnionPay</p></div><div class="note blue no-icon flat"><p>2021年快到了….</p></div><div class="note pink no-icon flat"><p>小心开车 安全至上</p></div><div class="note red no-icon flat"><p>这是三片呢?还是四片?</p></div><div class="note orange no-icon flat"><p>你是刷 Visa 还是 UnionPay</p></div><div class="note purple no-icon flat"><p>剪刀石头布</p></div><div class="note green no-icon flat"><p>前端最讨厌的浏览器</p></div></li></ol> </div> </details><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="note-5"><details class="folding-tag" cyan><summary> 方法一 </summary> <div class='content'> <ol><li><p><code>simple</code>样式</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line">{% note simple %}默认 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note default simple %}default 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note primary simple %}primary 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note success simple %}success 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note info simple %}info 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note warning simple %}warning 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note danger simple %}danger 提示块标签{% endnote %}</span><br></pre></td></tr></table></figure></li><li><p><code>modern</code>样式</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line">{% note modern %}默认 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note default modern %}default 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note primary modern %}primary 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note success modern %}success 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note info modern %}info 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note warning modern %}warning 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note danger modern %}danger 提示块标签{% endnote %}</span><br></pre></td></tr></table></figure></li><li><p><code>flat</code>样式</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line">{% note flat %}默认 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note default flat %}default 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note primary flat %}primary 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note success flat %}success 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note info flat %}info 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note warning flat %}warning 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note danger flat %}danger 提示块标签{% endnote %}</span><br></pre></td></tr></table></figure></li><li><p><code>disabled</code>样式</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line">{% note disabled %}默认 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note default disabled %}default 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note primary disabled %}primary 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note success disabled %}success 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note info disabled %}info 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note warning disabled %}warning 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note danger disabled %}danger 提示块标签{% endnote %}</span><br></pre></td></tr></table></figure></li><li><p><code>no-icon</code>样式</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line">{% note no-icon %}默认 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note default no-icon %}default 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note primary no-icon %}primary 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note success no-icon %}success 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note info no-icon %}info 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note warning no-icon %}warning 提示块标签{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note danger no-icon %}danger 提示块标签{% endnote %}</span><br></pre></td></tr></table></figure></li></ol> </div> </details><details class="folding-tag" blue><summary> 方法二 </summary> <div class='content'> <ol><li><p><code>simple</code>样式</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line">{% note 'fab fa-cc-visa' simple %}你是刷 Visa 还是 UnionPay{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note blue 'fas fa-bullhorn' simple %}2021年快到了....{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note pink 'fas fa-car-crash' simple %}小心开车 安全至上{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note red 'fas fa-fan' simple%}这是三片呢?还是四片?{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note orange 'fas fa-battery-half' simple %}你是刷 Visa 还是 UnionPay{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note purple 'far fa-hand-scissors' simple %}剪刀石头布{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note green 'fab fa-internet-explorer' simple %}前端最讨厌的浏览器{% endnote %}</span><br></pre></td></tr></table></figure></li><li><p><code>modern</code>样式</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line">{% note 'fab fa-cc-visa' modern %}你是刷 Visa 还是 UnionPay{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note blue 'fas fa-bullhorn' modern %}2021年快到了....{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note pink 'fas fa-car-crash' modern %}小心开车 安全至上{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note red 'fas fa-fan' modern%}这是三片呢?还是四片?{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note orange 'fas fa-battery-half' modern %}你是刷 Visa 还是 UnionPay{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note purple 'far fa-hand-scissors' modern %}剪刀石头布{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note green 'fab fa-internet-explorer' modern %}前端最讨厌的浏览器{% endnote %}</span><br></pre></td></tr></table></figure></li><li><p><code>flat</code>样式</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line">{% note 'fab fa-cc-visa' flat %}你是刷 Visa 还是 UnionPay{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note blue 'fas fa-bullhorn' flat %}2021年快到了....{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note pink 'fas fa-car-crash' flat %}小心开车 安全至上{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note red 'fas fa-fan' flat%}这是三片呢?还是四片?{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note orange 'fas fa-battery-half' flat %}你是刷 Visa 还是 UnionPay{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note purple 'far fa-hand-scissors' flat %}剪刀石头布{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note green 'fab fa-internet-explorer' flat %}前端最讨厌的浏览器{% endnote %}</span><br></pre></td></tr></table></figure></li><li><p><code>disabled</code>样式</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line">{% note 'fab fa-cc-visa' disabled %}你是刷 Visa 还是 UnionPay{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note blue 'fas fa-bullhorn' disabled %}2021年快到了....{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note pink 'fas fa-car-crash' disabled %}小心开车 安全至上{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note red 'fas fa-fan' disabled %}这是三片呢?还是四片?{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note orange 'fas fa-battery-half' disabled %}你是刷 Visa 还是 UnionPay{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note purple 'far fa-hand-scissors' disabled %}剪刀石头布{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note green 'fab fa-internet-explorer' disabled %}前端最讨厌的浏览器{% endnote %}</span><br></pre></td></tr></table></figure></li><li><p><code>no-icon</code>样式</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line">{% note no-icon %}你是刷 Visa 还是 UnionPay{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note blue no-icon %}2021年快到了....{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note pink no-icon %}小心开车 安全至上{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note red no-icon %}这是三片呢?还是四片?{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note orange no-icon %}你是刷 Visa 还是 UnionPay{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note purple no-icon %}剪刀石头布{% endnote %}</span><br><span class="line"></span><br><span class="line">{% note green no-icon %}前端最讨厌的浏览器{% endnote %}</span><br></pre></td></tr></table></figure></li></ol> </div> </details><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="上标标签-tip"><a href="#上标标签-tip" class="headerlink" title="上标标签 tip"></a>上标标签 tip</h2><div class="tip cogs"><p>主要样式参考自<a href="https://www.antmoe.com/posts/3b43914f/">小康的butterfly渐变背景标签</a>,自己写了个<code>tip.js</code>来渲染标签,精简了一下代码。</p></div><div class="tabs" id="tip"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#tip-1">标签语法</button></li><li class="tab"><button type="button" data-href="#tip-2">配置参数</button></li><li class="tab active"><button type="button" data-href="#tip-3">样式预览</button></li><li class="tab"><button type="button" data-href="#tip-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="tip-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% tip [参数,可选] %}文本内容{% endtip %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="tip-2"><ol><li>样式: success,error,warning,bolt,ban,home,sync,cogs,key,bell</li><li>自定义图标: 支持fontawesome。</li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="tip-3"><div class="tip "><p>default</p></div><div class="tip info"><p>info</p></div><div class="tip success"><p>success</p></div><div class="tip error"><p>error</p></div><div class="tip warning"><p>warning</p></div><div class="tip bolt"><p>bolt</p></div><div class="tip ban"><p>ban</p></div><div class="tip home"><p>home</p></div><div class="tip sync"><p>sync</p></div><div class="tip cogs"><p>cogs</p></div><div class="tip key"><p>key</p></div><div class="tip bell"><p>bell</p></div><div class="tip fa-atom"><p>自定义font awesome图标</p></div><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="tip-4"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line">{% tip %}default{% endtip %}</span><br><span class="line">{% tip info %}info{% endtip %}</span><br><span class="line">{% tip success %}success{% endtip %}</span><br><span class="line">{% tip error %}error{% endtip %}</span><br><span class="line">{% tip warning %}warning{% endtip %}</span><br><span class="line">{% tip bolt %}bolt{% endtip %}</span><br><span class="line">{% tip ban %}ban{% endtip %}</span><br><span class="line">{% tip home %}home{% endtip %}</span><br><span class="line">{% tip sync %}sync{% endtip %}</span><br><span class="line">{% tip cogs %}cogs{% endtip %}</span><br><span class="line">{% tip key %}key{% endtip %}</span><br><span class="line">{% tip bell %}bell{% endtip %}</span><br><span class="line">{% tip fa-atom %}自定义font awesome图标{% endtip %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="动态标签-anima"><a href="#动态标签-anima" class="headerlink" title="动态标签 anima"></a>动态标签 anima</h2><div class="tip fa-gamepad faa-horizontal animated"><p>动态标签的实质是引用了<a href="https://github.com/l-lin/font-awesome-animation">font-awesome-animation</a>的css样式,不一定局限于tip标签,也可以是其他标签。<br>只不过这里<code>tip.js</code>是我自己写的,所以我清楚它会怎么被渲染成html,才用的这个写法。<br>可以熟读文档,使用html语言来编写其他标签类型。</p></div><div class="tabs" id="tip"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#tip-1">标签语法</button></li><li class="tab"><button type="button" data-href="#tip-2">配置参数</button></li><li class="tab active"><button type="button" data-href="#tip-3">样式预览</button></li><li class="tab"><button type="button" data-href="#tip-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="tip-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% tip [参数,可选] %}文本内容{% endtip %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="tip-2"><div class="note blue icon-padding simple"><i class="note-icon fas fa-bullhorn"></i><p>更多详情请参看<a href="http://l-lin.github.io/font-awesome-animation/">font-awesome-animation文档</a></p><ol><li>将所需的CSS类添加到图标(或DOM中的任何元素)。</li><li>对于父级悬停样式,需要给目标元素添加指定CSS类,同时还要给目标元素的父级元素添加CSS类<code>faa-parent animated-hover</code>。(详情见示例及示例源码)<br>You can regulate the speed of the animation by adding the CSS class or . faa-fastfaa-slow</li><li>可以通过给目标元素添加CSS类<code>faa-fast</code>或<code>faa-slow</code>来控制动画快慢。</li></ol></div><div class="table-container"><table><thead><tr><th style="text-align:left">On DOM load<br>当页面加载时<br>显示动画</th><th style="text-align:left">On hover<br>当鼠标悬停时<br>显示动画</th><th style="text-align:left">On parent hover<br>当鼠标悬停<br>在父级元素时<br>显示动画</th></tr></thead><tbody><tr><td style="text-align:left"><span><i class="fas fa-wrench faa-wrench animated"></i> faa-wrench animated</span></td><td style="text-align:left"><span><i class="fas fa-wrench faa-wrench animated-hover"></i> faa-wrench animated-hover</span></td><td style="text-align:left"><span class="faa-parent animated-hover"><i class="fas fa-wrench faa-wrench"></i> faa-wrench</span></td></tr><tr><td style="text-align:left"><span><i class="fas fa-bell faa-ring animated"></i> faa-ring animated</span></td><td style="text-align:left"><span><i class="fas fa-bell faa-ring animated-hover"></i> faa-ring animated-hover</span></td><td style="text-align:left"><span class="faa-parent animated-hover"><i class="fas fa-bell faa-ring"></i> faa-ring</span></td></tr><tr><td style="text-align:left"><span><i class="fas fa-envelope faa-horizontal animated"></i> faa-horizontal animated</span></td><td style="text-align:left"><span><i class="fas fa-envelope faa-horizontal animated-hover"></i> faa-horizontal animated-hover</span></td><td style="text-align:left"><span class="faa-parent animated-hover"><i class="fas fa-envelope faa-horizontal"></i> faa-horizontal</span></td></tr><tr><td style="text-align:left"><span><i class="fas fa-thumbs-up faa-vertical animated"></i> faa-vertical animated</span></td><td style="text-align:left"><span><i class="fas fa-thumbs-up faa-vertical animated-hover"></i> faa-vertical animated-hover</span></td><td style="text-align:left"><span class="faa-parent animated-hover"><i class="fas fa-thumbs-up faa-vertical"></i> faa-vertical</span></td></tr><tr><td style="text-align:left"><span><i class="fas fa-exclamation-triangle faa-flash animated"></i> faa-flash animated</span></td><td style="text-align:left"><span><i class="fas fa-exclamation-triangle faa-flash animated-hover"></i> faa-flash animated-hover</span></td><td style="text-align:left"><span class="faa-parent animated-hover"><i class="fas fa-exclamation-triangle faa-flash"></i> faa-flash</span></td></tr><tr><td style="text-align:left"><span><i class="fas fa-thumbs-up faa-bounce animated"></i> faa-bounce animated</span></td><td style="text-align:left"><span><i class="fas fa-thumbs-up faa-bounce animated-hover"></i> faa-bounce animated-hover</span></td><td style="text-align:left"><span class="faa-parent animated-hover"><i class="fas fa-thumbs-up faa-bounce"></i> faa-bounce</span></td></tr><tr><td style="text-align:left"><span><i class="fas fa-spinner faa-spin animated"></i> faa-spin animated</span></td><td style="text-align:left"><span><i class="fas fa-spinner faa-spin animated-hover"></i> faa-spin animated-hover</span></td><td style="text-align:left"><span class="faa-parent animated-hover"><i class="fas fa-spinner faa-spin"></i> faa-spin</span></td></tr><tr><td style="text-align:left"><span><i class="fas fa-plane faa-tada animated"></i> faa-tada animated</span></td><td style="text-align:left"><span><i class="fas fa-plane faa-tada animated-hover"></i> faa-tada animated-hover</span></td><td style="text-align:left"><span class="faa-parent animated-hover"><i class="fas fa-plane faa-tada"></i> faa-tada</span></td></tr><tr><td style="text-align:left"><span><i class="fas fa-heart faa-pulse animated"></i> faa-pulse animated</span></td><td style="text-align:left"><span><i class="fas fa-heart faa-pulse animated-hover"></i> faa-pulse animated-hover</span></td><td style="text-align:left"><span class="faa-parent animated-hover"><i class="fas fa-heart faa-pulse"></i> faa-pulse</span></td></tr><tr><td style="text-align:left"><span><i class="fas fa-envelope faa-shake animated"></i> faa-shake animated</span></td><td style="text-align:left"><span><i class="fas fa-envelope faa-shake animated-hover"></i> faa-shake animated-hover</span></td><td style="text-align:left"><span class="faa-parent animated-hover"><i class="fas fa-envelope faa-shake"></i> faa-shake</span></td></tr><tr><td style="text-align:left"><span><i class="fas fa-trophy faa-tada animated"></i> faa-tada animated</span></td><td style="text-align:left"><span><i class="fas fa-trophy faa-tada animated-hover"></i> faa-tada animated-hover</span></td><td style="text-align:left"><span class="faa-parent animated-hover"><i class="fas fa-trophy faa-tada"></i> faa-tada</span></td></tr><tr><td style="text-align:left"><span><i class="fas fa-space-shuttle faa-passing animated"></i> faa-passing animated</span></td><td style="text-align:left"><span><i class="fas fa-space-shuttle faa-passing animated-hover"></i> faa-passing animated-hover</span></td><td style="text-align:left"><span class="faa-parent animated-hover"><i class="fas fa-space-shuttle faa-passing"></i> faa-passing</span></td></tr><tr><td style="text-align:left"><span><i class="fas fa-space-shuttle faa-passing-reverse animated"></i> faa-passing-reverse animated</span></td><td style="text-align:left"><span><i class="fas fa-space-shuttle faa-passing-reverse animated-hover"></i> faa-passing-reverse animated-hover</span></td><td style="text-align:left"><span class="faa-parent animated-hover"><i class="fas fa-space-shuttle faa-passing-reverse"></i> faa-passing-reverse</span></td></tr><tr><td style="text-align:left"><span><i class="fas fa-circle faa-burst animated"></i> faa-burst animated</span></td><td style="text-align:left"><span><i class="fas fa-circle faa-burst animated-hover"></i> faa-burst animated-hover</span></td><td style="text-align:left"><span class="faa-parent animated-hover"><i class="fas fa-circle faa-burst"></i> faa-burst</span></td></tr><tr><td style="text-align:left"><span><i class="fas fa-star faa-falling animated"></i> faa-falling animated</span></td><td style="text-align:left"><span><i class="fas fa-star faa-falling animated-hover"></i> faa-falling animated-hover</span></td><td style="text-align:left"><span class="faa-parent animated-hover"><i class="fas fa-star faa-falling"></i> faa-falling</span></td></tr><tr><td style="text-align:left"><span><i class="fas fa-rocket faa-rising animated"></i> faa-rising animated</span></td><td style="text-align:left"><span><i class="fas fa-rocket faa-rising animated-hover"></i> faa-rising animated-hover</span></td><td style="text-align:left"><span class="faa-parent animated-hover"><i class="fas fa-rocket faa-rising"></i> faa-rising</span></td></tr></tbody></table></div><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="tip-3"><ol><li><p>On DOM load(当页面加载时显示动画)</p><div class="tip warning faa-horizontal animated"><p>warning</p></div><div class="tip ban faa-flash animated"><p>ban</p></div></li><li><p>调整动画速度。</p><div class="tip warning faa-horizontal animated faa-fast"><p>warning</p></div><div class="tip ban faa-flash animated faa-slow"><p>ban</p></div></li><li><p>On hover(当鼠标悬停时显示动画)</p><div class="tip warning faa-horizontal animated-hover"><p>warning</p></div><div class="tip ban faa-flash animated-hover"><p>ban</p></div></li><li><p>On parent hover(当鼠标悬停在父级元素时显示动画)</p><div class="tip warning faa-parent animated-hover"><p class="faa-horizontal">warning</p></div><div class="tip ban faa-parent animated-hover"><p class="faa-flash">ban</p></div></li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="tip-4"><ol><li><p>On DOM load(当页面加载时显示动画)</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% tip warning faa-horizontal animated %}warning{% endtip %}</span><br><span class="line">{% tip ban faa-flash animated %}ban{% endtip %}</span><br></pre></td></tr></table></figure></li><li><p>调整动画速度</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% tip warning faa-horizontal animated faa-fast %}warning{% endtip %}</span><br><span class="line">{% tip ban faa-flash animated faa-slow %}ban{% endtip %}</span><br></pre></td></tr></table></figure></li><li><p>On hover(当鼠标悬停时显示动画)</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% tip warning faa-horizontal animated-hover %}warning{% endtip %}</span><br><span class="line">{% tip ban faa-flash animated-hover %}ban{% endtip %}</span><br></pre></td></tr></table></figure></li><li><p>On parent hover(当鼠标悬停在父级元素时显示动画)</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% tip warning faa-parent animated-hover %}<span class="language-xml"><span class="tag"><<span class="name">p</span> <span class="attr">class</span>=<span class="string">"faa-horizontal"</span>></span></span>warning<span class="language-xml"><span class="tag"></<span class="name">p</span>></span></span>{% endtip %}</span><br><span class="line">{% tip ban faa-parent animated-hover %}<span class="language-xml"><span class="tag"><<span class="name">p</span> <span class="attr">class</span>=<span class="string">"faa-flash"</span>></span></span>ban<span class="language-xml"><span class="tag"></<span class="name">p</span>></span></span>{% endtip %}</span><br></pre></td></tr></table></figure></li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="复选列表-checkbox"><a href="#复选列表-checkbox" class="headerlink" title="复选列表 checkbox"></a>复选列表 checkbox</h2><div class="tabs" id="checkbox"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#checkbox-1">标签语法</button></li><li class="tab"><button type="button" data-href="#checkbox-2">配置参数</button></li><li class="tab active"><button type="button" data-href="#checkbox-3">样式预览</button></li><li class="tab"><button type="button" data-href="#checkbox-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="checkbox-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% checkbox 样式参数(可选), 文本(支持简单md) %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="checkbox-2"><ol><li>样式: plus, minus, times</li><li>颜色: <span class='p red'>red</span>,<span class='p yellow'>yellow</span>,<span class='p green'>green</span>,<span class='p cyan'>cyan</span>,<span class='p blue'>blue</span>,<span class='p gray'>gray</span></li><li>选中状态: checked</li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="checkbox-3"><div class='checkbox'><input type="checkbox" /> <p>纯文本测试</p> </div><div class='checkbox checked'><input type="checkbox" checked="checked"/> <p>支持简单的 <a href="https://guides.github.com/features/mastering-markdown/">markdown</a> 语法</p> </div><div class='checkbox red'><input type="checkbox" /> <p>支持自定义颜色</p> </div><div class='checkbox green checked'><input type="checkbox" checked="checked"/> <p>绿色 + 默认选中</p> </div><div class='checkbox yellow checked'><input type="checkbox" checked="checked"/> <p>黄色 + 默认选中</p> </div><div class='checkbox cyan checked'><input type="checkbox" checked="checked"/> <p>青色 + 默认选中</p> </div><div class='checkbox blue checked'><input type="checkbox" checked="checked"/> <p>蓝色 + 默认选中</p> </div><div class='checkbox plus green checked'><input type="checkbox" checked="checked"/> <p>增加</p> </div><div class='checkbox minus yellow checked'><input type="checkbox" checked="checked"/> <p>减少</p> </div><div class='checkbox times red checked'><input type="checkbox" checked="checked"/> <p>叉</p> </div><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="checkbox-4"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><span class="line">{% checkbox 纯文本测试 %}</span><br><span class="line">{% checkbox checked, 支持简单的 [<span class="string">markdown</span>](<span class="link">https://guides.github.com/features/mastering-markdown/</span>) 语法 %}</span><br><span class="line">{% checkbox red, 支持自定义颜色 %}</span><br><span class="line">{% checkbox green checked, 绿色 + 默认选中 %}</span><br><span class="line">{% checkbox yellow checked, 黄色 + 默认选中 %}</span><br><span class="line">{% checkbox cyan checked, 青色 + 默认选中 %}</span><br><span class="line">{% checkbox blue checked, 蓝色 + 默认选中 %}</span><br><span class="line">{% checkbox plus green checked, 增加 %}</span><br><span class="line">{% checkbox minus yellow checked, 减少 %}</span><br><span class="line">{% checkbox times red checked, 叉 %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="单选列表-radio"><a href="#单选列表-radio" class="headerlink" title="单选列表 radio"></a>单选列表 radio</h2><div class="tabs" id="radio"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#radio-1">标签语法</button></li><li class="tab"><button type="button" data-href="#radio-2">配置参数</button></li><li class="tab active"><button type="button" data-href="#radio-3">样式预览</button></li><li class="tab"><button type="button" data-href="#radio-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="radio-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% radio 样式参数(可选), 文本(支持简单md) %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="radio-2"><ol><li>颜色: <span class='p red'>red</span>,<span class='p yellow'>yellow</span>,<span class='p green'>green</span>,<span class='p cyan'>cyan</span>,<span class='p blue'>blue</span>,<span class='p gray'>gray</span></li><li>选中状态: checked</li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="radio-3"><div class='checkbox'><input type="radio" /> <p>纯文本测试</p> </div><div class='checkbox checked'><input type="radio" checked="checked"/> <p>支持简单的 <a href="https://guides.github.com/features/mastering-markdown/">markdown</a> 语法</p> </div><div class='checkbox red'><input type="radio" /> <p>支持自定义颜色</p> </div><div class='checkbox green'><input type="radio" /> <p>绿色</p> </div><div class='checkbox yellow'><input type="radio" /> <p>黄色</p> </div><div class='checkbox cyan'><input type="radio" /> <p>青色</p> </div><div class='checkbox blue'><input type="radio" /> <p>蓝色</p> </div><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="radio-4"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">{% radio 纯文本测试 %}</span><br><span class="line">{% radio checked, 支持简单的 [<span class="string">markdown</span>](<span class="link">https://guides.github.com/features/mastering-markdown/</span>) 语法 %}</span><br><span class="line">{% radio red, 支持自定义颜色 %}</span><br><span class="line">{% radio green, 绿色 %}</span><br><span class="line">{% radio yellow, 黄色 %}</span><br><span class="line">{% radio cyan, 青色 %}</span><br><span class="line">{% radio blue, 蓝色 %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="时间轴-timeline"><a href="#时间轴-timeline" class="headerlink" title="时间轴 timeline"></a>时间轴 timeline</h2><div class="tip fa-wrench"><p>插件版v1.0.16以后,为避免与Butterfly_v4.0+版本中的timeline外挂标签冲突,已经移除了插件内的timeline外挂标签,请低于Butterfly_v4.0的用户升级主题或安装1.0.15版本的外挂标签插件,或者自行添加timeline.js和timeline.styl文件至对应文件夹。请使用了原有timeline外挂标签的用户受累替换语法格式。<br>Butterfly_v4.0+自带的timeline外挂标签样式更加好看。语法语意也更加清晰。</p></div><div class="tabs" id="timeline"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#timeline-1">标签语法</button></li><li class="tab active"><button type="button" data-href="#timeline-2">参数配置</button></li><li class="tab"><button type="button" data-href="#timeline-3">样式预览</button></li><li class="tab"><button type="button" data-href="#timeline-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="timeline-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line">{% timeline 时间线标题(可选)[,color] %}</span><br><span class="line"><!-- timeline 时间节点(标题) --></span><br><span class="line">正文内容</span><br><span class="line"><!-- endtimeline --></span><br><span class="line"><!-- timeline 时间节点(标题) --></span><br><span class="line">正文内容</span><br><span class="line"><!-- endtimeline --></span><br><span class="line">{% endtimeline %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="timeline-2"><div class="table-container"><table><thead><tr><th style="text-align:left">参数</th><th style="text-align:left">解释</th></tr></thead><tbody><tr><td style="text-align:left">title</td><td style="text-align:left">标题/时间线</td></tr><tr><td style="text-align:left">color</td><td style="text-align:left"><code>timeline</code>颜色:default(留空) / blue / pink / red / purple / orange / green</td></tr></tbody></table></div><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="timeline-3"><div class="timeline blue"><div class='timeline-item headline'><div class='timeline-item-title'><div class='item-circle'><p>时间轴样式</p></div></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2020-05-15 <a href="https://github.com/volantis-x/hexo-theme-volantis/releases/tag/2.6.6">2.6.3 -> 2.6.6</a></p></div></div><div class='timeline-item-content'><p>不需要额外处理。</p></div></div><div class='timeline-item'><div class='timeline-item-title'><div class='item-circle'><p>2020-04-20 <a href="https://github.com/volantis-x/hexo-theme-volantis/releases/tag/2.6.3">2.6.2 -> 2.6.3</a></p></div></div><div class='timeline-item-content'><ol><li>全局搜索 <code>seotitle</code> 并替换为 <code>seo_title</code>。</li><li>group 组件的索引规则有变,使用 group 组件的文章内,<code>group: group_name</code> 对应的组件名必须是 <code>group_name</code>。</li><li>group 组件的列表名优先显示文章的 <code>short_title</code> 其次是 <code>title</code>。</li></ol></div></div></div><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="timeline-4"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br></pre></td><td class="code"><pre><span class="line">{% timeline 时间轴样式,blue %}</span><br><span class="line"></span><br><span class="line"><!-- timeline 2020-07-24 [<span class="string">2.6.6 -> 3.0</span>](<span class="link">https://github.com/volantis-x/hexo-theme-volantis/releases</span>) --></span><br><span class="line"></span><br><span class="line"><span class="bullet">1.</span> 如果有 <span class="code">`hexo-lazyload-image`</span> 插件,需要删除并重新安装最新版本,设置 <span class="code">`lazyload.isSPA: true`</span>。</span><br><span class="line"><span class="bullet">2.</span> 2.x 版本的 css 和 js 不适用于 3.x 版本,如果使用了 <span class="code">`use_cdn: true`</span> 则需要删除。</span><br><span class="line"><span class="bullet">3.</span> 2.x 版本的 fancybox 标签在 3.x 版本中被重命名为 gallery 。</span><br><span class="line"><span class="bullet">4.</span> 2.x 版本的置顶 <span class="code">`top: true`</span> 改为了 <span class="code">`pin: true`</span>,并且同样适用于 <span class="code">`layout: page`</span> 的页面。</span><br><span class="line"><span class="bullet">5.</span> 如果使用了 <span class="code">`hexo-offline`</span> 插件,建议卸载,3.0 版本默认开启了 pjax 服务。</span><br><span class="line"></span><br><span class="line"><!-- endtimeline --></span><br><span class="line"></span><br><span class="line"><!-- timeline 2020-05-15 [<span class="string">2.6.3 -> 2.6.6</span>](<span class="link">https://github.com/volantis-x/hexo-theme-volantis/releases/tag/2.6.6</span>) --></span><br><span class="line"></span><br><span class="line">不需要额外处理。</span><br><span class="line"></span><br><span class="line"><!-- endtimeline --></span><br><span class="line"></span><br><span class="line"><!-- timeline 2020-04-20 [<span class="string">2.6.2 -> 2.6.3</span>](<span class="link">https://github.com/volantis-x/hexo-theme-volantis/releases/tag/2.6.3</span>) --></span><br><span class="line"></span><br><span class="line"><span class="bullet">1.</span> 全局搜索 <span class="code">`seotitle`</span> 并替换为 <span class="code">`seo_title`</span>。</span><br><span class="line"><span class="bullet">2.</span> group 组件的索引规则有变,使用 group 组件的文章内,<span class="code">`group: group_name`</span> 对应的组件名必须是 <span class="code">`group_name`</span>。</span><br><span class="line"><span class="bullet">2.</span> group 组件的列表名优先显示文章的 <span class="code">`short_title`</span> 其次是 <span class="code">`title`</span>。</span><br><span class="line"></span><br><span class="line"><!-- endtimeline --></span><br><span class="line"></span><br><span class="line">{% endtimeline %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="链接卡片-link"><a href="#链接卡片-link" class="headerlink" title="链接卡片 link"></a>链接卡片 link</h2><div class="tabs" id="link"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#link-1">标签语法</button></li><li class="tab active"><button type="button" data-href="#link-2">样式预览</button></li><li class="tab"><button type="button" data-href="#link-3">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="link-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% link 标题, 链接, 图片链接(可选) %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="link-2"><div class="tag link"><a class="link-card" title="糖果屋教程贴" href="https://akilar.top/posts/615e2dec/"><div class="left"><img src="https://npm.elemecdn.com/akilar-candyassets/image/siteicon/favicon.ico"/></div><div class="right"><p class="text">糖果屋教程贴</p><p class="url">https://akilar.top/posts/615e2dec/</p></div></a></div><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="link-3"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% link 糖果屋教程贴, https://akilar.top/posts/615e2dec/, https://npm.elemecdn.com/akilar-candyassets/image/siteicon/favicon.ico %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="按钮-btns"><a href="#按钮-btns" class="headerlink" title="按钮 btns"></a>按钮 btns</h2><div class="note blue icon-padding simple"><i class="note-icon fas fa-bullhorn"></i><p><code>Volantis</code>的按钮使用的是<code>btn</code>和<code>btns</code>标签。<code>btns</code>和<code>butterfly</code>的<code>button</code>不冲突,但是<code>btn</code>会被强制渲染,导致部分参数失效,而且<code>btn</code>的效果还是<code>butterfly</code>的<code>button</code>更好看些。所以就只适配了<code>btns</code>。</p></div><div class="tabs" id="btn"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#btn-1">标签语法</button></li><li class="tab"><button type="button" data-href="#btn-2">参数配置</button></li><li class="tab active"><button type="button" data-href="#btn-3">样式预览</button></li><li class="tab"><button type="button" data-href="#btn-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="btn-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">{% btns 样式参数 %}</span><br><span class="line">{% cell 标题, 链接, 图片或者图标 %}</span><br><span class="line">{% cell 标题, 链接, 图片或者图标 %}</span><br><span class="line">{% endbtns %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="btn-2"><ol><li>圆角样式:rounded, circle</li><li>增加文字样式:可以在容器内增加 <code><b>标题</b></code>和<code><p>描述文字</p></code></li><li>布局方式:<br>默认为自动宽度,适合视野内只有一两个的情况。</li></ol><div class="table-container"><table><thead><tr><th style="text-align:left">参数</th><th style="text-align:left">含义</th></tr></thead><tbody><tr><td style="text-align:left">wide</td><td style="text-align:left">宽一点的按钮</td></tr><tr><td style="text-align:left">fill</td><td style="text-align:left">填充布局,自动铺满至少一行,多了会换行</td></tr><tr><td style="text-align:left">center</td><td style="text-align:left">居中,按钮之间是固定间距</td></tr><tr><td style="text-align:left">around</td><td style="text-align:left">居中分散</td></tr><tr><td style="text-align:left">grid2</td><td style="text-align:left">等宽最多2列,屏幕变窄会适当减少列数</td></tr><tr><td style="text-align:left">grid3</td><td style="text-align:left">等宽最多3列,屏幕变窄会适当减少列数</td></tr><tr><td style="text-align:left">grid4</td><td style="text-align:left">等宽最多4列,屏幕变窄会适当减少列数</td></tr><tr><td style="text-align:left">grid5</td><td style="text-align:left">等宽最多5列,屏幕变窄会适当减少列数</td></tr></tbody></table></div><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="btn-3"><ol><li><p>如果需要显示类似「团队成员」之类的一组含有头像的链接:</p><div class="btns circle grid5"> <a class="button" href='https://xaoxuu.com' title='xaoxuu'><img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png'>xaoxuu</a><a class="button" href='https://xaoxuu.com' title='xaoxuu'><img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png'>xaoxuu</a><a class="button" href='https://xaoxuu.com' title='xaoxuu'><img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png'>xaoxuu</a><a class="button" href='https://xaoxuu.com' title='xaoxuu'><img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png'>xaoxuu</a><a class="button" href='https://xaoxuu.com' title='xaoxuu'><img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png'>xaoxuu</a> </div></li><li><p>或者含有图标的按钮:</p><div class="btns rounded grid5"> <a class="button" href='/' title='下载源码'><i class='fas fa-download'></i>下载源码</a><a class="button" href='/' title='查看文档'><i class='fas fa-book-open'></i>查看文档</a> </div></li><li><p>圆形图标 + 标题 + 描述 + 图片 + 网格5列 + 居中</p><div class="btns circle center grid5"> <a href='https://apps.apple.com/cn/app/heart-mate-pro-hrm-utility/id1463348922?ls=1'><i class='fab fa-apple'></i><b>心率管家</b><p class='p red'>专业版</p><img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/qrcode/heartmate_pro.png'></a><a href='https://apps.apple.com/cn/app/heart-mate-lite-hrm-utility/id1475747930?ls=1'><i class='fab fa-apple'></i><b>心率管家</b><p class='p green'>免费版</p><img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/qrcode/heartmate_lite.png'></a> </div></li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="btn-4"><ol><li>如果需要显示类似「团队成员」之类的一组含有头像的链接:<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">{% btns circle grid5 %}</span><br><span class="line">{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}</span><br><span class="line">{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}</span><br><span class="line">{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}</span><br><span class="line">{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}</span><br><span class="line">{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}</span><br><span class="line">{% endbtns %}</span><br></pre></td></tr></table></figure></li><li>或者含有图标的按钮:<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">{% btns rounded grid5 %}</span><br><span class="line">{% cell 下载源码, /, fas fa-download %}</span><br><span class="line">{% cell 查看文档, /, fas fa-book-open %}</span><br><span class="line">{% endbtns %}</span><br></pre></td></tr></table></figure></li><li>圆形图标 + 标题 + 描述 + 图片 + 网格5列 + 居中<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br></pre></td><td class="code"><pre><span class="line">{% btns circle center grid5 %}</span><br><span class="line"><span class="language-xml"><span class="tag"><<span class="name">a</span> <span class="attr">href</span>=<span class="string">'https://apps.apple.com/cn/app/heart-mate-pro-hrm-utility/id1463348922?ls=1'</span>></span></span></span><br><span class="line"> <span class="language-xml"><span class="tag"><<span class="name">i</span> <span class="attr">class</span>=<span class="string">'fab fa-apple'</span>></span></span><span class="language-xml"><span class="tag"></<span class="name">i</span>></span></span></span><br><span class="line"> <span class="language-xml"><span class="tag"><<span class="name">b</span>></span></span>心率管家<span class="language-xml"><span class="tag"></<span class="name">b</span>></span></span></span><br><span class="line"> {% p red, 专业版 %}</span><br><span class="line"> <span class="language-xml"><span class="tag"><<span class="name">img</span> <span class="attr">src</span>=<span class="string">'https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/qrcode/heartmate_pro.png'</span>></span></span></span><br><span class="line"><span class="language-xml"><span class="tag"></<span class="name">a</span>></span></span></span><br><span class="line"><span class="language-xml"><span class="tag"><<span class="name">a</span> <span class="attr">href</span>=<span class="string">'https://apps.apple.com/cn/app/heart-mate-lite-hrm-utility/id1475747930?ls=1'</span>></span></span></span><br><span class="line"> <span class="language-xml"><span class="tag"><<span class="name">i</span> <span class="attr">class</span>=<span class="string">'fab fa-apple'</span>></span></span><span class="language-xml"><span class="tag"></<span class="name">i</span>></span></span></span><br><span class="line"> <span class="language-xml"><span class="tag"><<span class="name">b</span>></span></span>心率管家<span class="language-xml"><span class="tag"></<span class="name">b</span>></span></span></span><br><span class="line"> {% p green, 免费版 %}</span><br><span class="line"> <span class="language-xml"><span class="tag"><<span class="name">img</span> <span class="attr">src</span>=<span class="string">'https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/qrcode/heartmate_lite.png'</span>></span></span></span><br><span class="line"><span class="language-xml"><span class="tag"></<span class="name">a</span>></span></span></span><br><span class="line">{% endbtns %}</span><br></pre></td></tr></table></figure></li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="github卡片-ghcard"><a href="#github卡片-ghcard" class="headerlink" title="github卡片 ghcard"></a>github卡片 ghcard</h2><div class="note blue icon-padding modern"><i class="note-icon fas fa-bullhorn"></i><p>ghcard使用了<code>github-readme-stats</code>的API,支持直接使用markdown语法来写。</p></div><div class="tabs" id="ghcard"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#ghcard-1">标签语法</button></li><li class="tab"><button type="button" data-href="#ghcard-2">配置参数</button></li><li class="tab active"><button type="button" data-href="#ghcard-3">样式预览</button></li><li class="tab"><button type="button" data-href="#ghcard-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="ghcard-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% ghcard 用户名, 其它参数(可选) %}</span><br><span class="line">{% ghcard 用户名/仓库, 其它参数(可选) %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="ghcard-2"><p>更多参数可以参考:<br><a class="ghcard" rel="external nofollow noopener noreferrer" href="https://github.com/anuraghazra/github-readme-stats"><img src="https://github-readme-stats.vercel.app/api/pin/?username=anuraghazra&repo=github-readme-stats&show_owner=true"/></a><br>使用<code>,</code>分割各个参数。写法为:<code>参数名=参数值</code><br>以下只写几个常用参数值。</p><div class="table-container"><table><thead><tr><th style="text-align:left">参数名</th><th style="text-align:left">取值</th><th style="text-align:left">释义</th></tr></thead><tbody><tr><td style="text-align:left">hide</td><td style="text-align:left">stars,commits,prs,issues,contribs</td><td style="text-align:left">隐藏指定统计</td></tr><tr><td style="text-align:left">count_private</td><td style="text-align:left">true</td><td style="text-align:left">将私人项目贡献添加到总提交计数中</td></tr><tr><td style="text-align:left">show_icons</td><td style="text-align:left">true</td><td style="text-align:left">显示图标</td></tr><tr><td style="text-align:left">theme</td><td style="text-align:left">请查阅<a href="https://github.com/anuraghazra/github-readme-stats/blob/master/themes/README.md">Available Themes</a></td><td style="text-align:left">主题</td></tr></tbody></table></div><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="ghcard-3"><ol><li>用户信息卡片</li></ol><div class="table-container"><table><thead><tr><th><a class="ghcard" rel="external nofollow noopener noreferrer" href="https://github.com/xaoxuu"><img src="https://github-readme-stats.vercel.app/api/?username=xaoxuu&show_owner=true"/></a></th><th><a class="ghcard" rel="external nofollow noopener noreferrer" href="https://github.com/xaoxuu"><img src="https://github-readme-stats.vercel.app/api/?username=xaoxuu&theme=vue&show_owner=true"/></a></th></tr></thead><tbody><tr><td><a class="ghcard" rel="external nofollow noopener noreferrer" href="https://github.com/xaoxuu"><img src="https://github-readme-stats.vercel.app/api/?username=xaoxuu&theme=buefy&show_owner=true"/></a></td><td><a class="ghcard" rel="external nofollow noopener noreferrer" href="https://github.com/xaoxuu"><img src="https://github-readme-stats.vercel.app/api/?username=xaoxuu&theme=solarized-light&show_owner=true"/></a></td></tr><tr><td><a class="ghcard" rel="external nofollow noopener noreferrer" href="https://github.com/xaoxuu"><img src="https://github-readme-stats.vercel.app/api/?username=xaoxuu&theme=onedark&show_owner=true"/></a></td><td><a class="ghcard" rel="external nofollow noopener noreferrer" href="https://github.com/xaoxuu"><img src="https://github-readme-stats.vercel.app/api/?username=xaoxuu&theme=solarized-dark&show_owner=true"/></a></td></tr><tr><td><a class="ghcard" rel="external nofollow noopener noreferrer" href="https://github.com/xaoxuu"><img src="https://github-readme-stats.vercel.app/api/?username=xaoxuu&theme=algolia&show_owner=true"/></a></td><td><a class="ghcard" rel="external nofollow noopener noreferrer" href="https://github.com/xaoxuu"><img src="https://github-readme-stats.vercel.app/api/?username=xaoxuu&theme=calm&show_owner=true"/></a></td></tr></tbody></table></div><ol><li>仓库信息卡片</li></ol><div class="table-container"><table><thead><tr><th><a class="ghcard" rel="external nofollow noopener noreferrer" href="https://github.com/volantis-x/hexo-theme-volantis"><img src="https://github-readme-stats.vercel.app/api/pin/?username=volantis-x&repo=hexo-theme-volantis&show_owner=true"/></a></th><th><a class="ghcard" rel="external nofollow noopener noreferrer" href="https://github.com/volantis-x/hexo-theme-volantis"><img src="https://github-readme-stats.vercel.app/api/pin/?username=volantis-x&repo=hexo-theme-volantis&theme=vue&show_owner=true"/></a></th></tr></thead><tbody><tr><td><a class="ghcard" rel="external nofollow noopener noreferrer" href="https://github.com/volantis-x/hexo-theme-volantis"><img src="https://github-readme-stats.vercel.app/api/pin/?username=volantis-x&repo=hexo-theme-volantis&theme=buefy&show_owner=true"/></a></td><td><a class="ghcard" rel="external nofollow noopener noreferrer" href="https://github.com/volantis-x/hexo-theme-volantis"><img src="https://github-readme-stats.vercel.app/api/pin/?username=volantis-x&repo=hexo-theme-volantis&theme=solarized-light&show_owner=true"/></a></td></tr><tr><td><a class="ghcard" rel="external nofollow noopener noreferrer" href="https://github.com/volantis-x/hexo-theme-volantis"><img src="https://github-readme-stats.vercel.app/api/pin/?username=volantis-x&repo=hexo-theme-volantis&theme=onedark&show_owner=true"/></a></td><td><a class="ghcard" rel="external nofollow noopener noreferrer" href="https://github.com/volantis-x/hexo-theme-volantis"><img src="https://github-readme-stats.vercel.app/api/pin/?username=volantis-x&repo=hexo-theme-volantis&theme=solarized-dark&show_owner=true"/></a></td></tr><tr><td><a class="ghcard" rel="external nofollow noopener noreferrer" href="https://github.com/volantis-x/hexo-theme-volantis"><img src="https://github-readme-stats.vercel.app/api/pin/?username=volantis-x&repo=hexo-theme-volantis&theme=algolia&show_owner=true"/></a></td><td><a class="ghcard" rel="external nofollow noopener noreferrer" href="https://github.com/volantis-x/hexo-theme-volantis"><img src="https://github-readme-stats.vercel.app/api/pin/?username=volantis-x&repo=hexo-theme-volantis&theme=calm&show_owner=true"/></a></td></tr></tbody></table></div><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="ghcard-4"><ol><li><p>用户信息卡片</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">| {% ghcard xaoxuu %} | {% ghcard xaoxuu, theme=vue %} |</span><br><span class="line">| -- | -- |</span><br><span class="line">| {% ghcard xaoxuu, theme=buefy %} | {% ghcard xaoxuu, theme=solarized-light %} |</span><br><span class="line">| {% ghcard xaoxuu, theme=onedark %} | {% ghcard xaoxuu, theme=solarized-dark %} |</span><br><span class="line">| {% ghcard xaoxuu, theme=algolia %} | {% ghcard xaoxuu, theme=calm %} |</span><br></pre></td></tr></table></figure></li><li><p>仓库信息卡片</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">| {% ghcard volantis-x/hexo-theme-volantis %} | {% ghcard volantis-x/hexo-theme-volantis, theme=vue %} |</span><br><span class="line">| -- | -- |</span><br><span class="line">| {% ghcard volantis-x/hexo-theme-volantis, theme=buefy %} | {% ghcard volantis-x/hexo-theme-volantis, theme=solarized-light %} |</span><br><span class="line">| {% ghcard volantis-x/hexo-theme-volantis, theme=onedark %} | {% ghcard volantis-x/hexo-theme-volantis, theme=solarized-dark %} |</span><br><span class="line">| {% ghcard volantis-x/hexo-theme-volantis, theme=algolia %} | {% ghcard volantis-x/hexo-theme-volantis, theme=calm %} |</span><br></pre></td></tr></table></figure></li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="github徽标-ghbdage"><a href="#github徽标-ghbdage" class="headerlink" title="github徽标 ghbdage"></a>github徽标 ghbdage</h2><div class="tip cogs"><p>关于ghbdage参数的更多具体用法可以参看站内教程:<a href="/posts/e87ad7f8">添加github徽标</a></p></div><div class="tabs" id="ghbdage"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#ghbdage-1">标签语法</button></li><li class="tab"><button type="button" data-href="#ghbdage-2">配置参数</button></li><li class="tab active"><button type="button" data-href="#ghbdage-3">样式预览</button></li><li class="tab"><button type="button" data-href="#ghbdage-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="ghbdage-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% bdage [right],[left],[logo]||[color],[link],[title]||[option] %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="ghbdage-2"><ol><li><code>left</code>:徽标左边的信息,必选参数。</li><li><code>right</code>: 徽标右边的信息,必选参数,</li><li><code>logo</code>:徽标图标,图标名称详见<a href="https://simpleicons.org/">simpleicons</a>,可选参数。</li><li><code>color</code>:徽标右边的颜色,可选参数。</li><li><code>link</code>:指向的链接,可选参数。</li><li><code>title</code>:徽标的额外信息,可选参数。主要用于优化SEO,但<code>object</code>标签不会像<code>a</code>标签一样在鼠标悬停显示<code>title</code>信息。</li><li><code>option</code>:自定义参数,支持<a href="https://shields.io/">shields.io</a>的全部API参数支持,具体参数可以参看上文中的拓展写法示例。形式为<code>name1=value2&name2=value2</code>。</li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="ghbdage-3"><p><div class="note info modern"><p>本外挂标签的参数分为三组,用<code>||</code>分割。</p></div></p><ol><li>基本参数<br><br><object class="ghbdage" style="margin-inline:5px" title="" standby="loading..." data="https://img.shields.io/badge/Butterfly-Theme-orange?logo=&color=orange&link=&"></object><object class="ghbdage" style="margin-inline:5px" title="" standby="loading..." data="https://img.shields.io/badge/Hexo-Frame-orange?logo=hexo&color=orange&link=&"></object></li><li>信息参数<br><br><object class="ghbdage" style="margin-inline:5px" title="本站使用JsDelivr为静态资源提供CDN加速" standby="loading..." data="https://img.shields.io/badge/JsDelivr-CDN-orange?logo=jsDelivr&color=abcdef&link=https://metroui.org.ua/index.html&"></object><object class="ghbdage" style="margin-inline:5px" title="" standby="loading..." data="https://img.shields.io/badge/GitHub-Source-orange?logo=GitHub&color=orange&link=https://github.com/&"></object></li><li>拓展参数<br><br><object class="ghbdage" style="margin-inline:5px" title="本站采用双线部署,默认线路托管于Vercel" standby="loading..." data="https://img.shields.io/badge/Vercel-Hosted-orange?logo=Vercel&color=brightgreen&link=https://vercel.com/&style=social&logoWidth=40"></object><object class="ghbdage" style="margin-inline:5px" title="" standby="loading..." data="https://img.shields.io/badge/Vercel-Hosted-orange?logo=Vercel&color=orange&link=&style=social&logoWidth=40&logoColor=violet"></object></li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="ghbdage-4"><p><div class="note info modern"><p>本外挂标签的参数分为三组,用<code>||</code>分割。</p></div></p><ol><li>基本参数,定义徽标左右文字和图标<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% bdage Theme,Butterfly %}</span><br><span class="line">{% bdage Frame,Hexo,hexo %}</span><br></pre></td></tr></table></figure></li><li>信息参数,定义徽标右侧内容背景色,指向链接<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% bdage CDN,JsDelivr,jsDelivr||abcdef,https://metroui.org.ua/index.html,本站使用JsDelivr为静态资源提供CDN加速 %}</span><br><span class="line">//如果是跨顺序省略可选参数,仍然需要写个逗号,用作分割</span><br><span class="line">{% bdage Source,GitHub,GitHub||,https://github.com/ %}</span><br></pre></td></tr></table></figure></li><li>拓展参数,支持shields的API的全部参数内容<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% bdage Hosted,Vercel,Vercel||brightgreen,https://vercel.com/,本站采用双线部署,默认线路托管于Vercel||style=social&logoWidth=20 %}</span><br><span class="line">//如果是跨顺序省略可选参数组,仍然需要写双竖线||用作分割</span><br><span class="line">{% bdage Hosted,Vercel,Vercel||||style=social&logoWidth=20&logoColor=violet %}</span><br></pre></td></tr></table></figure></li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="网站卡片-sites"><a href="#网站卡片-sites" class="headerlink" title="网站卡片 sites"></a>网站卡片 sites</h2><div class="tabs" id="site"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#site-1">标签语法</button></li><li class="tab active"><button type="button" data-href="#site-2">样式预览</button></li><li class="tab"><button type="button" data-href="#site-3">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="site-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">{% sitegroup %}</span><br><span class="line">{% site 标题, url=链接, screenshot=截图链接, avatar=头像链接(可选), description=描述(可选) %}</span><br><span class="line">{% site 标题, url=链接, screenshot=截图链接, avatar=头像链接(可选), description=描述(可选) %}</span><br><span class="line">{% endsitegroup %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="site-2"><div class="site-card-group"><a class="site-card" href="https://xaoxuu.com"><div class="img"><img src="https://i.loli.net/2020/08/21/VuSwWZ1xAeUHEBC.jpg"/></div><div class="info"><img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png"/><span class="title">xaoxuu</span><span class="desc">简约风格</span></div></a><a class="site-card" href="https://inkss.cn"><div class="img"><img src="https://i.loli.net/2020/08/21/Vzbu3i8fXs6Nh5Y.jpg"/></div><div class="info"><img src="https://cdn.jsdelivr.net/gh/inkss/common@master/static/web/avatar.jpg"/><span class="title">inkss</span><span class="desc">这是一段关于这个网站的描述文字</span></div></a><a class="site-card" href="https://blog.mhuig.top"><div class="img"><img src="https://i.loli.net/2020/08/22/d24zpPlhLYWX6D1.png"/></div><div class="info"><img src="https://cdn.jsdelivr.net/gh/MHuiG/imgbed@master/data/p.png"/><span class="title">MHuiG</span><span class="desc">这是一段关于这个网站的描述文字</span></div></a><a class="site-card" href="https://colsrch.top"><div class="img"><img src="https://i.loli.net/2020/08/22/dFRWXm52OVu8qfK.png"/></div><div class="info"><img src="https://cdn.jsdelivr.net/gh/Colsrch/images/Colsrch/avatar.jpg"/><span class="title">Colsrch</span><span class="desc">这是一段关于这个网站的描述文字</span></div></a><a class="site-card" href="https://linhk1606.github.io"><div class="img"><img src="https://i.loli.net/2020/08/21/3PmGLCKicnfow1x.png"/></div><div class="info"><img src="https://i.loli.net/2020/02/09/PN7I5RJfFtA93r2.png"/><span class="title">Linhk1606</span><span class="desc">这是一段关于这个网站的描述文字</span></div></a></div><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="site-3"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">{% sitegroup %}</span><br><span class="line">{% site xaoxuu, url=https://xaoxuu.com, screenshot=https://i.loli.net/2020/08/21/VuSwWZ1xAeUHEBC.jpg, avatar=https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png, description=简约风格 %}</span><br><span class="line">{% site inkss, url=https://inkss.cn, screenshot=https://i.loli.net/2020/08/21/Vzbu3i8fXs6Nh5Y.jpg, avatar=https://cdn.jsdelivr.net/gh/inkss/common@master/static/web/avatar.jpg, description=这是一段关于这个网站的描述文字 %}</span><br><span class="line">{% site MHuiG, url=https://blog.mhuig.top, screenshot=https://i.loli.net/2020/08/22/d24zpPlhLYWX6D1.png, avatar=https://cdn.jsdelivr.net/gh/MHuiG/imgbed@master/data/p.png, description=这是一段关于这个网站的描述文字 %}</span><br><span class="line">{% site Colsrch, url=https://colsrch.top, screenshot=https://i.loli.net/2020/08/22/dFRWXm52OVu8qfK.png, avatar=https://cdn.jsdelivr.net/gh/Colsrch/images/Colsrch/avatar.jpg, description=这是一段关于这个网站的描述文字 %}</span><br><span class="line">{% site Linhk1606, url=https://linhk1606.github.io, screenshot=https://i.loli.net/2020/08/21/3PmGLCKicnfow1x.png, avatar=https://i.loli.net/2020/02/09/PN7I5RJfFtA93r2.png, description=这是一段关于这个网站的描述文字 %}</span><br><span class="line">{% endsitegroup %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="行内图片-inlineimage"><a href="#行内图片-inlineimage" class="headerlink" title="行内图片 inlineimage"></a>行内图片 inlineimage</h2><div class="tabs" id="inlineimage"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#inlineimage-1">标签语法</button></li><li class="tab"><button type="button" data-href="#inlineimage-2">参数配置</button></li><li class="tab active"><button type="button" data-href="#inlineimage-3">样式预览</button></li><li class="tab"><button type="button" data-href="#inlineimage-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="inlineimage-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% inlineimage 图片链接, height=高度(可选) %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="inlineimage-2"><ol><li>高度:height=20px</li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="inlineimage-3"><p>这是 <img no-lazy class="inline" src="https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/aru-l/0000.gif" style="height:1.5em"/> 一段话。</p><p>这又是 <img no-lazy class="inline" src="https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/aru-l/5150.gif" style="height:40px;"/> 一段话。</p><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="inlineimage-4"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">这是 {% inlineimage https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/aru-l/0000.gif %} 一段话。</span><br><span class="line"></span><br><span class="line">这又是 {% inlineimage https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/aru-l/5150.gif, height=40px %} 一段话。</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="单张图片-image"><a href="#单张图片-image" class="headerlink" title="单张图片 image"></a>单张图片 image</h2><div class="tabs" id="image"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#image-1">标签语法</button></li><li class="tab"><button type="button" data-href="#image-2">参数配置</button></li><li class="tab active"><button type="button" data-href="#image-3">样式预览</button></li><li class="tab"><button type="button" data-href="#image-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="image-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% image 链接, width=宽度(可选), height=高度(可选), alt=描述(可选), bg=占位颜色(可选) %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="image-2"><ol><li>图片宽度高度:width=300px, height=32px</li><li>图片描述:alt=图片描述(butterfly需要在主题配置文件中开启图片描述)</li><li>占位背景色:bg=#f2f2f2</li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="image-3"><ol><li><p>添加描述:</p><div class="img-wrap"><div class="img-bg"><img class="img" src="https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg" alt="每天下课回宿舍的路,没有什么故事。"/></div><span class="image-caption">每天下课回宿舍的路,没有什么故事。</span></div></li><li><p>指定宽度:</p><div class="img-wrap"><div class="img-bg"><img class="img" src="https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg" style="width:400px;"/></div></div></li><li><p>指定宽度并添加描述:</p><div class="img-wrap"><div class="img-bg"><img class="img" src="https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg" alt="每天下课回宿舍的路,没有什么故事。" style="width:400px;"/></div><span class="image-caption">每天下课回宿舍的路,没有什么故事。</span></div></li><li><p>设置占位背景色:</p><div class="img-wrap"><div class="img-bg" style="background:#1D0C04"><img class="img" src="https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg" alt="优化不同宽度浏览的观感" style="width:400px;"/></div><span class="image-caption">优化不同宽度浏览的观感</span></div></li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="image-4"><ol><li><p>添加描述:</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% image https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg, alt=每天下课回宿舍的路,没有什么故事。 %}</span><br></pre></td></tr></table></figure></li><li>指定宽度:<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% image https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg, width=400px %}</span><br></pre></td></tr></table></figure></li><li>指定宽度并添加描述:<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% image https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg, width=400px, alt=每天下课回宿舍的路,没有什么故事。 %}</span><br></pre></td></tr></table></figure></li><li>设置占位背景色:<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% image https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg, width=400px, bg=#1D0C04, alt=优化不同宽度浏览的观感 %}</span><br></pre></td></tr></table></figure></li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="音频-audio"><a href="#音频-audio" class="headerlink" title="音频 audio"></a>音频 audio</h2><div class="tabs" id="audio"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#audio-1">标签语法</button></li><li class="tab active"><button type="button" data-href="#audio-2">样式预览</button></li><li class="tab"><button type="button" data-href="#audio-3">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="audio-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% audio 音频链接 %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="audio-2"><div class="audio"><audio controls preload><source src='https://github.com/volantis-x/volantis-docs/releases/download/assets/Lumia1020.mp3' type='audio/mp3'>Your browser does not support the audio tag.</audio></div><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="audio-3"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% audio https://github.com/volantis-x/volantis-docs/releases/download/assets/Lumia1020.mp3 %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="视频-video"><a href="#视频-video" class="headerlink" title="视频 video"></a>视频 video</h2><div class="tabs" id="video"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#video-1">标签语法</button></li><li class="tab"><button type="button" data-href="#video-2">参数配置</button></li><li class="tab active"><button type="button" data-href="#video-3">样式预览</button></li><li class="tab"><button type="button" data-href="#video-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="video-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% video 视频链接 %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="video-2"><ol><li>对其方向:left, center, right</li><li>列数:逗号后面直接写列数,支持 1 ~ 4 列。</li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="video-3"><ol><li><p>100%宽度</p><div class="video"><video controls preload><source src='https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov' type='video/mp4'>Your browser does not support the video tag.</video></div></li><li><p>50%宽度</p><div class="videos" col='2'><div class="video"><video controls preload><source src='https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov' type='video/mp4'>Your browser does not support the video tag.</video></div><div class="video"><video controls preload><source src='https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov' type='video/mp4'>Your browser does not support the video tag.</video></div><div class="video"><video controls preload><source src='https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov' type='video/mp4'>Your browser does not support the video tag.</video></div><div class="video"><video controls preload><source src='https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov' type='video/mp4'>Your browser does not support the video tag.</video></div></div></li><li><p>25%宽度</p><div class="videos" col='4'><div class="video"><video controls preload><source src='https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov' type='video/mp4'>Your browser does not support the video tag.</video></div><div class="video"><video controls preload><source src='https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov' type='video/mp4'>Your browser does not support the video tag.</video></div><div class="video"><video controls preload><source src='https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov' type='video/mp4'>Your browser does not support the video tag.</video></div><div class="video"><video controls preload><source src='https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov' type='video/mp4'>Your browser does not support the video tag.</video></div><div class="video"><video controls preload><source src='https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov' type='video/mp4'>Your browser does not support the video tag.</video></div><div class="video"><video controls preload><source src='https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov' type='video/mp4'>Your browser does not support the video tag.</video></div><div class="video"><video controls preload><source src='https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov' type='video/mp4'>Your browser does not support the video tag.</video></div><div class="video"><video controls preload><source src='https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov' type='video/mp4'>Your browser does not support the video tag.</video></div></div></li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="video-4"><ol><li><p>100%宽度</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG<span class="emphasis">_0341.mov %}</span></span><br></pre></td></tr></table></figure></li><li><p>50%宽度</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line">{% videos, 2 %}</span><br><span class="line">{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG<span class="emphasis">_0341.mov %}</span></span><br><span class="line"><span class="emphasis">{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_</span>0341.mov %}</span><br><span class="line">{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG<span class="emphasis">_0341.mov %}</span></span><br><span class="line"><span class="emphasis">{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_</span>0341.mov %}</span><br><span class="line">{% endvideos %}</span><br></pre></td></tr></table></figure></li><li><p>25%宽度</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><span class="line">{% videos, 4 %}</span><br><span class="line">{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG<span class="emphasis">_0341.mov %}</span></span><br><span class="line"><span class="emphasis">{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_</span>0341.mov %}</span><br><span class="line">{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG<span class="emphasis">_0341.mov %}</span></span><br><span class="line"><span class="emphasis">{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_</span>0341.mov %}</span><br><span class="line">{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG<span class="emphasis">_0341.mov %}</span></span><br><span class="line"><span class="emphasis">{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_</span>0341.mov %}</span><br><span class="line">{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG<span class="emphasis">_0341.mov %}</span></span><br><span class="line"><span class="emphasis">{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_</span>0341.mov %}</span><br><span class="line">{% endvideos %}</span><br></pre></td></tr></table></figure></li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="相册-gallery"><a href="#相册-gallery" class="headerlink" title="相册 gallery"></a>相册 gallery</h2><div class="note blue icon-padding disabled"><i class="note-icon fas fa-bullhorn"></i><p><code>Butterfly</code>自带<code>gallery</code>相册,而且会根据图片大小自动调整排版,效果比<code>Volantis</code>的<code>gallery</code>更好,故不再收录<code>Volantis</code>的<code>gallery</code>标签。</p></div><div class="note flat"><p>以下为<code>Butterfly</code>自带的<code>gallery</code>标签写法。相册图库和相册配合使用。</p></div><div class="tabs" id="gallery"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#gallery-1">标签语法</button></li><li class="tab"><button type="button" data-href="#gallery-2">参数配置</button></li><li class="tab active"><button type="button" data-href="#gallery-3">样式预览</button></li><li class="tab"><button type="button" data-href="#gallery-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="gallery-1"><ol><li><p>gallerygroup 相册图库</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><span class="language-xml"><span class="tag"><<span class="name">div</span> <span class="attr">class</span>=<span class="string">"gallery-group-main"</span>></span></span></span><br><span class="line">{% galleryGroup name description link img-url %}</span><br><span class="line">{% galleryGroup name description link img-url %}</span><br><span class="line">{% galleryGroup name description link img-url %}</span><br><span class="line"><span class="language-xml"><span class="tag"></<span class="name">div</span>></span></span></span><br></pre></td></tr></table></figure></li><li><p>gallery 相册</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% gallery %}</span><br><span class="line">markdown 圖片格式</span><br><span class="line">{% endgallery %}</span><br></pre></td></tr></table></figure></li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="gallery-2"><ul><li>gallerygroup 相册图库</li></ul><div class="table-container"><table><thead><tr><th style="text-align:left">参数名</th><th style="text-align:left">释义</th></tr></thead><tbody><tr><td style="text-align:left">name</td><td style="text-align:left">图库名字</td></tr><tr><td style="text-align:left">description</td><td style="text-align:left">图库描述</td></tr><tr><td style="text-align:left">link</td><td style="text-align:left">链接到对应相册的地址</td></tr><tr><td style="text-align:left">img-url</td><td style="text-align:left">图库封面</td></tr></tbody></table></div><div class="note info flat"><p>思维拓展一下,相册图库的实质其实就是个快捷方式,可以自定义添加描述、封面、链接。那么我们未必要把它当做一个相册,完全可以作为一个链接卡片,链接到视频、QQ、友链都是不错的选择。</p></div><ul><li>gallery 相册<br>区别于旧版的Gallery相册,新的Gallery相册会自动根据图片长度进行排版,书写也更加方便,与markdown格式一样。可根据需要插入到相应的md。无需再自己配置长宽。<strong>建议在粘贴时故意使用长短、大小、横竖不一的图片</strong>,会有更好的效果。(尺寸完全相同的图片只会平铺输出,效果很糟糕)</li></ul><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="gallery-3"><ul><li>gallerygroup 相册图库</li></ul><div class="gallery-group-main"> <figure class="gallery-group"> <img class="gallery-group-img no-lightbox" src='https://npm.elemecdn.com/akilar-candyassets/image/1.jpg' alt="Group Image Gallery"> <figcaption> <div class="gallery-group-name">MC</div> <p>在Rikkaの六花服务器里留下的足迹</p> <a href='/gallery/MC/'></a> </figcaption> </figure> <figure class="gallery-group"> <img class="gallery-group-img no-lightbox" src='https://npm.elemecdn.com/akilar-candyassets/image/20200907110508327.png' alt="Group Image Gallery"> <figcaption> <div class="gallery-group-name">Gundam</div> <p>哦咧哇gundam哒!</p> <a href='/gallery/Gundam/'></a> </figcaption> </figure> <figure class="gallery-group"> <img class="gallery-group-img no-lightbox" src='https://npm.elemecdn.com/akilar-candyassets/image/20200907113116651.png' alt="Group Image Gallery"> <figcaption> <div class="gallery-group-name">I-am-Akilar</div> <p>某种意义上也算自拍吧</p> <a href='/gallery/I-am-Akilar/'></a> </figcaption> </figure></div><ul><li>gallery 相册</li></ul><div class="gallery"> <div class="fj-gallery data" data-rowHeight="220" data-limit="10"> <span class="gallery-data">[{"url":"https://i.loli.net/2019/12/25/Fze9jchtnyJXMHN.jpg","alt":""},{"url":"https://i.loli.net/2019/12/25/ryLVePaqkYm4TEK.jpg","alt":""},{"url":"https://i.loli.net/2019/12/25/gEy5Zc1Ai6VuO4N.jpg","alt":""},{"url":"https://i.loli.net/2019/12/25/d6QHbytlSYO4FBG.jpg","alt":""},{"url":"https://i.loli.net/2019/12/25/6nepIJ1xTgufatZ.jpg","alt":""},{"url":"https://i.loli.net/2019/12/25/E7Jvr4eIPwUNmzq.jpg","alt":""},{"url":"https://i.loli.net/2019/12/25/mh19anwBSWIkGlH.jpg","alt":""},{"url":"https://i.loli.net/2019/12/25/2tu9JC8ewpBFagv.jpg","alt":""}]</span> </div> <button class="gallery-load-more"><span>加载更多</span><i class="fa-solid fa-arrow-down"></i></button> </div><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="gallery-4"><div class="note info flat"><p>对于很多同学提问的<code>gallerygroup</code>和<code>gallery</code>相册页的链接问题。这里说下我个人的使用习惯。<br>一般使用相册图库的话,可以在导航栏加一个gallery的page(<strong>使用指令<code>hexo new page gallery</code>添加</strong>),里面放相册图库作为封面。然后在<code>[Blogroot]/source/gallery/</code>下面建立相应的文件夹,例如若按照这里的示例,若欲使用<code>/gallery/MC/</code>路径访问MC相册,则需要新建<code>[Blogroot]/source/gallery/MC/index.md</code>,并在里面填入<code>gallery</code>相册内容。</p></div><ol><li><p>gallerygroup 相册图库</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><span class="language-xml"><span class="tag"><<span class="name">div</span> <span class="attr">class</span>=<span class="string">"gallery-group-main"</span>></span></span></span><br><span class="line">{% galleryGroup MC 在Rikkaの六花服务器里留下的足迹 '/gallery/MC/' https://npm.elemecdn.com/akilar-candyassets/image/1.jpg %}</span><br><span class="line">{% galleryGroup Gundam 哦咧哇gundam哒! '/gallery/Gundam/' https://npm.elemecdn.com/akilar-candyassets/image/20200907110508327.png %}</span><br><span class="line">{% galleryGroup I-am-Akilar 某种意义上也算自拍吧 '/gallery/I-am-Akilar/' https://npm.elemecdn.com/akilar-candyassets/image/20200907113116651.png %}</span><br><span class="line"><span class="language-xml"><span class="tag"></<span class="name">div</span>></span></span></span><br></pre></td></tr></table></figure></li><li><p>gallery 相册</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><span class="line">{% gallery %}</span><br><span class="line"></span><br><span class="line"></span><br><span class="line"></span><br><span class="line"></span><br><span class="line"></span><br><span class="line"></span><br><span class="line"></span><br><span class="line"></span><br><span class="line">{% endgallery %}</span><br></pre></td></tr></table></figure></li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="折叠框-folding"><a href="#折叠框-folding" class="headerlink" title="折叠框 folding"></a>折叠框 folding</h2><div class="note blue icon-padding disabled"><i class="note-icon fas fa-bullhorn"></i><p><code>Butterfly</code>虽然也有内置折叠框<code>hideToggle</code>标签,但是<code>Volantis</code>的<code>folding</code>折叠框更好看一些。</p></div><div class="tabs" id="folding"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#folding-1">标签语法</button></li><li class="tab"><button type="button" data-href="#folding-2">配置参数</button></li><li class="tab active"><button type="button" data-href="#folding-3">样式预览</button></li><li class="tab"><button type="button" data-href="#folding-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="folding-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% folding 参数(可选), 标题 %}</span><br><span class="line"></span><br><span class="line">{% endfolding %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="folding-2"><ol><li>颜色:blue, cyan, green, yellow, red</li><li>状态:状态填写 open 代表默认打开。</li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="folding-3"><details class="folding-tag" ><summary> 查看图片测试 </summary> <div class='content'> <p><img src="https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg" alt=""></p> </div> </details><details class="folding-tag" cyan open><summary> 查看默认打开的折叠框 </summary> <div class='content'> <p>这是一个默认打开的折叠框。</p> </div> </details><details class="folding-tag" green><summary> 查看代码测试 </summary> <div class='content'> <figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line"></span><br></pre></td></tr></table></figure> </div> </details><details class="folding-tag" yellow><summary> 查看列表测试 </summary> <div class='content'> <ul><li>haha</li><li>hehe</li></ul> </div> </details><details class="folding-tag" red><summary> 查看嵌套测试 </summary> <div class='content'> <details class="folding-tag" blue><summary> 查看嵌套测试2 </summary> <div class='content'> <details class="folding-tag" ><summary> 查看嵌套测试3 </summary> <div class='content'> <p>hahaha <span><img src='https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/tieba/%E6%BB%91%E7%A8%BD.png' style='height:24px'></span></p> </div> </details> </div> </details> </div> </details><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="folding-4"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br></pre></td><td class="code"><pre><span class="line">{% folding 查看图片测试 %}</span><br><span class="line"></span><br><span class="line"></span><br><span class="line"></span><br><span class="line">{% endfolding %}</span><br><span class="line"></span><br><span class="line">{% folding cyan open, 查看默认打开的折叠框 %}</span><br><span class="line"></span><br><span class="line">这是一个默认打开的折叠框。</span><br><span class="line"></span><br><span class="line">{% endfolding %}</span><br><span class="line"></span><br><span class="line">{% folding green, 查看代码测试 %}</span><br><span class="line">假装这里有代码块(代码块没法嵌套代码块)</span><br><span class="line">{% endfolding %}</span><br><span class="line"></span><br><span class="line">{% folding yellow, 查看列表测试 %}</span><br><span class="line"></span><br><span class="line"><span class="bullet">-</span> haha</span><br><span class="line"><span class="bullet">-</span> hehe</span><br><span class="line"></span><br><span class="line">{% endfolding %}</span><br><span class="line"></span><br><span class="line">{% folding red, 查看嵌套测试 %}</span><br><span class="line"></span><br><span class="line">{% folding blue, 查看嵌套测试2 %}</span><br><span class="line"></span><br><span class="line">{% folding 查看嵌套测试3 %}</span><br><span class="line"></span><br><span class="line">hahaha <span class="language-xml"><span class="tag"><<span class="name">span</span>></span></span><span class="language-xml"><span class="tag"><<span class="name">img</span> <span class="attr">src</span>=<span class="string">'https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/tieba/%E6%BB%91%E7%A8%BD.png'</span> <span class="attr">style</span>=<span class="string">'height:24px'</span>></span></span><span class="language-xml"><span class="tag"></<span class="name">span</span>></span></span></span><br><span class="line"></span><br><span class="line">{% endfolding %}</span><br><span class="line"></span><br><span class="line">{% endfolding %}</span><br><span class="line"></span><br><span class="line">{% endfolding %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="分栏-tab"><a href="#分栏-tab" class="headerlink" title="分栏 tab"></a>分栏 tab</h2><div class="note blue icon-padding disabled"><i class="note-icon fas fa-bullhorn"></i><p><code>Butterfly</code>的<code>tab</code>标签和<code>Volantis</code>的<code>tab</code>标签都是移值自<code>NexT</code>主题,所以写法和效果一模一样。</p></div><div class="tabs" id="folding"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#folding-1">标签语法</button></li><li class="tab"><button type="button" data-href="#folding-2">配置参数</button></li><li class="tab active"><button type="button" data-href="#folding-3">样式预览</button></li><li class="tab"><button type="button" data-href="#folding-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="folding-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">{% tabs Unique name, [index] %}</span><br><span class="line"><!-- tab [Tab caption] [@icon] --></span><br><span class="line">Any content (support inline tags too).</span><br><span class="line"><!-- endtab --></span><br><span class="line">{% endtabs %}</span><br><span class="line"></span><br><span class="line"></span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="folding-2"><ol><li>Unique name :<ul><li>选项卡块标签的唯一名称,不带逗号。</li><li>将在#id中用作每个标签及其索引号的前缀。</li><li>如果名称中包含空格,则对于生成#id,所有空格将由破折号代替。</li><li>仅当前帖子/页面的URL必须是唯一的!</li></ul></li><li>[index]:<ul><li>活动选项卡的索引号。</li><li>如果未指定,将选择第一个标签(1)。</li><li>如果index为-1,则不会选择任何选项卡。</li><li>可选参数。</li></ul></li><li>[Tab caption]:<ul><li>当前选项卡的标题。</li><li>如果未指定标题,则带有制表符索引后缀的唯一名称将用作制表符的标题。</li><li>如果未指定标题,但指定了图标,则标题将为空。</li><li>可选参数。</li></ul></li><li>[@icon]:<ul><li>FontAwesome图标名称(全名,看起来像“ fas fa-font”)</li><li>可以指定带空格或不带空格;</li><li>例如’Tab caption @icon’ 和 ‘Tab caption@icon’.</li><li>可选参数。</li></ul></li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="folding-3"><div class="note primary flat"><p>Demo 1 - 预设选择第一个【默认】</p></div><div class="tabs" id="test1"><ul class="nav-tabs"><li class="tab active"><button type="button" data-href="#test1-1">test1 1</button></li><li class="tab"><button type="button" data-href="#test1-2">test1 2</button></li><li class="tab"><button type="button" data-href="#test1-3">test1 3</button></li></ul><div class="tab-contents"><div class="tab-item-content active" id="test1-1"><p><strong>This is Tab 1.</strong></p><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="test1-2"><p><strong>This is Tab 2.</strong></p><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="test1-3"><p><strong>This is Tab 3.</strong></p><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><div class="note primary flat"><p>Demo 2 - 预设选择tabs</p></div><div class="tabs" id="test2"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#test2-1">test2 1</button></li><li class="tab"><button type="button" data-href="#test2-2">test2 2</button></li><li class="tab active"><button type="button" data-href="#test2-3">test2 3</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="test2-1"><p><strong>This is Tab 1.</strong></p><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="test2-2"><p><strong>This is Tab 2.</strong></p><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="test2-3"><p><strong>This is Tab 3.</strong></p><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><div class="note primary flat"><p>Demo 3 - 没有预设值</p></div><div class="tabs" id="test3"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#test3-1">test3 1</button></li><li class="tab"><button type="button" data-href="#test3-2">test3 2</button></li><li class="tab"><button type="button" data-href="#test3-3">test3 3</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="test3-1"><p><strong>This is Tab 1.</strong></p><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="test3-2"><p><strong>This is Tab 2.</strong></p><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="test3-3"><p><strong>This is Tab 3.</strong></p><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><div class="note primary flat"><p>Demo 4 - 自定义Tab名 + 只有icon + icon和Tab名</p></div><div class="tabs" id="test4"><ul class="nav-tabs"><li class="tab active"><button type="button" data-href="#test4-1">第一个Tab</button></li><li class="tab"><button type="button" data-href="#test4-2"><i class="fab fa-apple-pay" style="text-align: center;"></i></button></li><li class="tab"><button type="button" data-href="#test4-3"><i class="fas fa-bomb"></i>炸弹</button></li></ul><div class="tab-contents"><div class="tab-item-content active" id="test4-1"><p><strong>tab名字为第一个Tab</strong></p><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="test4-2"><p><strong>只有图标 没有Tab名字</strong></p><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="test4-3"><p><strong>名字+icon</strong></p><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="folding-4"><p><div class="note primary flat"><p>Demo 1 - 预设选择第一个【默认】</p></div><br><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line">{% tabs test1 %}</span><br><span class="line"><!-- tab --></span><br><span class="line"><span class="strong">**This is Tab 1.**</span></span><br><span class="line"><!-- endtab --></span><br><span class="line"></span><br><span class="line"><!-- tab --></span><br><span class="line"><span class="strong">**This is Tab 2.**</span></span><br><span class="line"><!-- endtab --></span><br><span class="line"></span><br><span class="line"><!-- tab --></span><br><span class="line"><span class="strong">**This is Tab 3.**</span></span><br><span class="line"><!-- endtab --></span><br><span class="line">{% endtabs %}</span><br></pre></td></tr></table></figure></p><p><div class="note primary flat"><p>Demo 2 - 预设选择tabs</p></div><br><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line">{% tabs test2, 3 %}</span><br><span class="line"><!-- tab --></span><br><span class="line"><span class="strong">**This is Tab 1.**</span></span><br><span class="line"><!-- endtab --></span><br><span class="line"></span><br><span class="line"><!-- tab --></span><br><span class="line"><span class="strong">**This is Tab 2.**</span></span><br><span class="line"><!-- endtab --></span><br><span class="line"></span><br><span class="line"><!-- tab --></span><br><span class="line"><span class="strong">**This is Tab 3.**</span></span><br><span class="line"><!-- endtab --></span><br><span class="line">{% endtabs %}</span><br></pre></td></tr></table></figure></p><p><div class="note primary flat"><p>Demo 3 - 没有预设值</p></div><br><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line">{% tabs test3, -1 %}</span><br><span class="line"><!-- tab --></span><br><span class="line"><span class="strong">**This is Tab 1.**</span></span><br><span class="line"><!-- endtab --></span><br><span class="line"></span><br><span class="line"><!-- tab --></span><br><span class="line"><span class="strong">**This is Tab 2.**</span></span><br><span class="line"><!-- endtab --></span><br><span class="line"></span><br><span class="line"><!-- tab --></span><br><span class="line"><span class="strong">**This is Tab 3.**</span></span><br><span class="line"><!-- endtab --></span><br><span class="line">{% endtabs %}</span><br></pre></td></tr></table></figure></p><p><div class="note primary flat"><p>Demo 4 - 自定义Tab名 + 只有icon + icon和Tab名</p></div><br><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line">{% tabs test4 %}</span><br><span class="line"><!-- tab 第一个Tab --></span><br><span class="line"><span class="strong">**tab名字为第一个Tab**</span></span><br><span class="line"><!-- endtab --></span><br><span class="line"></span><br><span class="line"><!-- tab @fab fa-apple-pay --></span><br><span class="line"><span class="strong">**只有图标 没有Tab名字**</span></span><br><span class="line"><!-- endtab --></span><br><span class="line"></span><br><span class="line"><!-- tab 炸弹@fas fa-bomb --></span><br><span class="line"><span class="strong">**名字+icon**</span></span><br><span class="line"><!-- endtab --></span><br><span class="line">{% endtabs %}</span><br></pre></td></tr></table></figure></p><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="数据集合-issues"><a href="#数据集合-issues" class="headerlink" title="数据集合 issues"></a>数据集合 issues</h2><script defer src="https://npm.elemecdn.com/jquery@latest/dist/jquery.min.js"></script><script defer src="https://npm.elemecdn.com/hexo-theme-volantis@4.3.1/source/js/issues.min.js"></script><div class="tabs" id="issues"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#issues-1">标签语法</button></li><li class="tab"><button type="button" data-href="#issues-2">参数配置</button></li><li class="tab active"><button type="button" data-href="#issues-3">样式预览</button></li><li class="tab"><button type="button" data-href="#issues-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="issues-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% issues type | api=url | group=key:value1,value2(可选) %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="issues-2"><p><span class='p center logo large'>type(类型):</span><br>根据需求不同,会将 issues 内容解析成不同的 HTML 标签,目前支持的类型有:</p><ol><li>时间轴<code>timeline</code>: 解析成<code>timeline</code>标签,<code>issue</code>的标题对应<code>timeline</code>的时间,<code>issue</code>的内容对应<code>timeline</code>的内容。</li><li><p>网站卡片<code>sites</code>: 解析成<code>sites</code>标签,需要有<code>JSON</code>代码块,各参数对应<code>sites</code>标签参数:</p><figure class="highlight json"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line"><span class="punctuation">{</span></span><br><span class="line"> <span class="attr">"title"</span><span class="punctuation">:</span> <span class="string">""</span><span class="punctuation">,</span></span><br><span class="line"> <span class="attr">"screenshot"</span><span class="punctuation">:</span> <span class="string">""</span><span class="punctuation">,</span></span><br><span class="line"> <span class="attr">"url"</span><span class="punctuation">:</span> <span class="string">""</span><span class="punctuation">,</span></span><br><span class="line"> <span class="attr">"avatar"</span><span class="punctuation">:</span> <span class="string">""</span><span class="punctuation">,</span></span><br><span class="line"> <span class="attr">"description"</span><span class="punctuation">:</span> <span class="string">""</span><span class="punctuation">,</span></span><br><span class="line"> <span class="attr">"「keywords」"</span><span class="punctuation">:</span> <span class="string">""</span></span><br><span class="line"><span class="punctuation">}</span></span><br></pre></td></tr></table></figure></li></ol><div class="table-container"><table><thead><tr><th style="text-align:left">参数</th><th style="text-align:left">释义</th></tr></thead><tbody><tr><td style="text-align:left">title</td><td style="text-align:left">网站名称</td></tr><tr><td style="text-align:left">screenshot</td><td style="text-align:left">网站预览图</td></tr><tr><td style="text-align:left">url</td><td style="text-align:left">网站链接,需要添加<br><code>https://</code>协议组成完整域名。<br>否则可能被识别成站点相对路径。</td></tr><tr><td style="text-align:left">avatar</td><td style="text-align:left">站长头像</td></tr><tr><td style="text-align:left">「keywords」</td><td style="text-align:left">分组依据,<br>未必要叫「keywords」,<br>详见下文group(分组)</td></tr></tbody></table></div><p><span class='p center logo large'>api(接口):</span><br>url为可以调的通的API,例如:<br><figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">api=https://gitee.com/api/v5/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=active</span><br><span class="line">api=https://api.github.com/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=active</span><br></pre></td></tr></table></figure></p><div class="table-container"><table><thead><tr><th style="text-align:left">参数</th><th style="text-align:left">释义</th></tr></thead><tbody><tr><td style="text-align:left"><a href="https://gitee.com/api/v5/">https://gitee.com/api/v5/</a></td><td style="text-align:left">gitee仓库的api</td></tr><tr><td style="text-align:left"><a href="https://api.github.com/">https://api.github.com/</a></td><td style="text-align:left">github仓库的api</td></tr><tr><td style="text-align:left">repos/xaoxuu/friends/issues</td><td style="text-align:left">repos/用户名/仓库名/issues</td></tr><tr><td style="text-align:left">sort=updated&state=open</td><td style="text-align:left">界定哪些类型的<code>issues</code>会<br>被读取过来渲染成相应的标签</td></tr><tr><td style="text-align:left">page=1&per_page=100</td><td style="text-align:left">读取前100条issues</td></tr><tr><td style="text-align:left">labels=active</td><td style="text-align:left">控制默认的issue不显示,<br>只有自己审核通过<br>添加了active标签之后才会显示</td></tr></tbody></table></div><p><span class='p center logo large'>group(分组):</span><br><code>sites</code>类型的<code>issues</code>默认不分组,如果需要分组,可指定分组依据<code>「keywords」</code>,和分组白名单<code>「value1」</code>、<code>「value2」</code>等,例如:</p><figure class="highlight yml"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">group=version:v4,v3,v2</span></span><br><span class="line"><span class="comment"># 此处的version就是上文中的「keywords」</span></span><br></pre></td></tr></table></figure><p>这个参数的作用就是,筛选出<code>JSON</code>中包含<code>"version": "v4"</code>或者<code>"version":"v3"</code>或者<code>"version": "v2"</code>的数据,并分组显示。</p><p><span class='p center logo large'>仓库ISSUES模板配置</span></p><details class="folding-tag" green><summary> Github仓库配置方案 </summary> <div class='content'> <ol><li><p>新建一个仓库,仓库名随意,这里我命名为<code>friend_link</code>,<br>新建文件<code>friend_link\.github\ISSUE_TEMPLATE.md</code>,<br>并在其中输入以下内容作为<code>issues</code>模板。</p><div class="tip warning faa-horizontal animated fa-slow"><p>其中的json代码块前面的反斜杠记得删去。此处这么写主要是为了转义,否则无法嵌套代码块。</p></div><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br></pre></td><td class="code"><pre><span class="line">---</span><br><span class="line">name: 友链模板</span><br><span class="line"><span class="section">about: 请根据指示规范填写友链格式。</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line"></span><br><span class="line"><!-- 请在下方代码块的双引号中填写 --></span><br><span class="line">\<span class="code">```json</span></span><br><span class="line"><span class="code">{</span></span><br><span class="line"><span class="code"> "title": "",</span></span><br><span class="line"><span class="code"> "screenshot": "",</span></span><br><span class="line"><span class="code"> "url": "",</span></span><br><span class="line"><span class="code"> "avatar": "",</span></span><br><span class="line"><span class="code"> "description": "",</span></span><br><span class="line"><span class="code"> "keywords": ""</span></span><br><span class="line"><span class="code">}</span></span><br><span class="line"><span class="code">\```</span></span><br><span class="line"></span><br><span class="line"><!--</span><br><span class="line">"title": "站点名称",</span><br><span class="line">"screenshot": "站点预览图链接",</span><br><span class="line">"url": "站点链接",</span><br><span class="line">"avatar": "头像链接",</span><br><span class="line">"description": "站点描述",</span><br><span class="line">"keywords": "关键词,作为分组名"</span><br><span class="line">--></span><br><span class="line"></span><br><span class="line"><!-- 示例 --></span><br><span class="line"></span><br><span class="line"><!--</span><br><span class="line">"title": "Akilarの糖果屋",</span><br><span class="line">"screenshot": "https://cdn.jsdelivr.net/gh/Akilarlxh/ScreenShot@gh-pages/akilar.top.jpg",</span><br><span class="line">"url": "https://akilar.top/",</span><br><span class="line">"avatar": "https://npm.elemecdn.com/akilar-candyassets/image/siteicon/favicon.png",</span><br><span class="line">"description": "期待您的光临!",</span><br><span class="line">"keywords": "糖果屋"</span><br><span class="line">--></span><br><span class="line"></span><br></pre></td></tr></table></figure></li><li><p>新建active label</p><p><img src="https://npm.elemecdn.com/akilar-candyassets/image/d63b5c0c.png" alt="新建label用于控制审核结果"></p><p><img src="https://npm.elemecdn.com/akilar-candyassets/image/6311f960.png" alt="配置名称描述颜色"></p></li><li><p>提交示例</p><p><img src="https://npm.elemecdn.com/akilar-candyassets/image/f87ebfd3.png" alt="填写规范"><br><img src="https://npm.elemecdn.com/akilar-candyassets/image/efdfc67d.png" alt="审核通过"></p></li><li><p>从审核通过到页面读取有一段api的缓存期,稍微有点耐心。</p></li></ol> </div> </details><details class="folding-tag" yellow><summary> Gitee仓库配置方案 </summary> <div class='content'> <ol><li><p>新建一个仓库,仓库名随意,这里我命名为<code>friend_link</code>,<br>新建文件<code>friend_link\.gitee\ISSUE_TEMPLATE.md</code>,<br>并在其中输入以下内容作为<code>issues</code>模板。</p><div class="tip warning faa-horizontal animated fa-slow"><p>其中的json代码块前面的反斜杠记得删去。此处这么写主要是为了转义,否则无法嵌套代码块。</p></div><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br></pre></td><td class="code"><pre><span class="line">---</span><br><span class="line">name: 友链模板</span><br><span class="line"><span class="section">about: 请根据指示规范填写友链格式。</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line"></span><br><span class="line"><!-- 请在下方代码块的双引号中填写 --></span><br><span class="line">\<span class="code">```json</span></span><br><span class="line"><span class="code">{</span></span><br><span class="line"><span class="code"> "title": "",</span></span><br><span class="line"><span class="code"> "screenshot": "",</span></span><br><span class="line"><span class="code"> "url": "",</span></span><br><span class="line"><span class="code"> "avatar": "",</span></span><br><span class="line"><span class="code"> "description": "",</span></span><br><span class="line"><span class="code"> "keywords": ""</span></span><br><span class="line"><span class="code">}</span></span><br><span class="line"><span class="code">\```</span></span><br><span class="line"></span><br><span class="line"><!--</span><br><span class="line">"title": "站点名称",</span><br><span class="line">"screenshot": "站点预览图链接",</span><br><span class="line">"url": "站点链接",</span><br><span class="line">"avatar": "头像链接",</span><br><span class="line">"description": "站点描述",</span><br><span class="line">"keywords": "关键词,作为分组名"</span><br><span class="line">--></span><br><span class="line"></span><br><span class="line"><!-- 示例 --></span><br><span class="line"></span><br><span class="line"><!--</span><br><span class="line">"title": "Akilarの糖果屋",</span><br><span class="line">"screenshot": "https://cdn.jsdelivr.net/gh/Akilarlxh/ScreenShot@gh-pages/akilar.top.jpg",</span><br><span class="line">"url": "https://akilar.top/",</span><br><span class="line">"avatar": "https://npm.elemecdn.com/akilar-candyassets/image/siteicon/favicon.png",</span><br><span class="line">"description": "期待您的光临!",</span><br><span class="line">"keywords": "糖果屋"</span><br><span class="line">--></span><br><span class="line"></span><br></pre></td></tr></table></figure></li><li><p>新建active标签</p><p><img src="https://npm.elemecdn.com/akilar-candyassets/image/7522911b.png" alt="新建标签用于控制审核结果"></p></li></ol><ol><li><p>提交示例</p><p><img src="https://npm.elemecdn.com/akilar-candyassets/image/dd334eea.png" alt="填写规范"><br><img src="https://npm.elemecdn.com/akilar-candyassets/image/72d06ae1.png" alt="审核通过"></p></li><li><p>从审核通过到页面读取有一段api的缓存期,稍微有点耐心。</p></li></ol> </div> </details><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="issues-3"><ol><li><p>时间轴标签<code>timeline</code>渲染<br>对应的仓库<code>issues</code>链接:</p><div class="tag link"><a class="link-card" title="xaoxuu/timeline" href="https://gitee.com/xaoxuu/timeline/issues"><div class="left"><img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets@master/logo/256/safari.png"/></div><div class="right"><p class="text">xaoxuu/timeline</p><p class="url">https://gitee.com/xaoxuu/timeline/issues</p></div></a></div><div class="issues-api timeline"api="https://gitee.com/api/v5/repos/xaoxuu/timeline/issues?state=open&creator=xaoxuu&sort=created&direction=desc&page=1&per_page=100"></div></li><li><p>网站卡片标签<code>sites</code>渲染</p><ul><li><p>gitee仓库示例</p><p>对应的仓库<code>issues</code>链接:</p><div class="tag link"><a class="link-card" title="xaoxuu/friends" href="https://gitee.com/xaoxuu/friends/issues"><div class="left"><img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets@master/logo/256/safari.png"/></div><div class="right"><p class="text">xaoxuu/friends</p><p class="url">https://gitee.com/xaoxuu/friends/issues</p></div></a></div><p>渲染后的标签:</p><div class="issues-api sites"api="https://gitee.com/api/v5/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=active"></div></li><li><p>github仓库示例</p><p>对应的仓库<code>issues</code>链接:</p><div class="tag link"><a class="link-card" title="xaoxuu/friends" href="https://github.com/xaoxuu/friends/issues"><div class="left"><img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets@master/logo/256/safari.png"/></div><div class="right"><p class="text">xaoxuu/friends</p><p class="url">https://github.com/xaoxuu/friends/issues</p></div></a></div><p>渲染后的标签:</p><div class="issues-api sites"api="https://api.github.com/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=active"></div></li></ul></li><li><p>网站卡片标签<code>sites</code>分组渲染<br>这是<code>Volantis</code>主题官网的「示例博客」页面的数据:<br>对应的仓库<code>issues</code>链接:</p><div class="tag link"><a class="link-card" title="如何参与项目" href="https://github.com/volantis-x/examples/issues"><div class="left"><img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets@master/logo/256/safari.png"/></div><div class="right"><p class="text">如何参与项目</p><p class="url">https://github.com/volantis-x/examples/issues</p></div></a></div><p>渲染后的标签:</p><div class="issues-api sites"api="https://api.github.com/repos/volantis-x/examples/issues?sort=updated&state=open&page=1&per_page=100"group="version:版本:^4.0,版本:^3.0,版本:^2.0"></div></li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="issues-4"><ol><li><p>时间轴标签<code>timeline</code>渲染</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% issues timeline | api=https://gitee.com/api/v5/repos/xaoxuu/timeline/issues?state=open&creator=xaoxuu&sort=created&direction=desc&page=1&per<span class="emphasis">_page=100 %}</span></span><br></pre></td></tr></table></figure></li><li><p>网站卡片标签<code>sites</code>渲染</p><ul><li><p>gitee仓库示例</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% issues sites | api=https://gitee.com/api/v5/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per<span class="emphasis">_page=100&labels=active %}</span></span><br></pre></td></tr></table></figure></li><li><p>github仓库示例</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% issues sites | api=https://api.github.com/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per<span class="emphasis">_page=100&labels=active %}</span></span><br></pre></td></tr></table></figure></li></ul></li><li><p>网站卡片标签<code>sites</code>分组渲染<br>这是<code>Volantis</code>主题官网的「示例博客」页面的数据:</p><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% issues sites | api=https://api.github.com/repos/volantis-x/examples/issues?sort=updated&state=open&page=1&per<span class="emphasis">_page=100 | group=version:版本:^4.0,版本:^3.0,版本:^2.0 %}</span></span><br></pre></td></tr></table></figure></li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="诗词标签-poem"><a href="#诗词标签-poem" class="headerlink" title="诗词标签 poem"></a>诗词标签 poem</h2><div class="tabs" id="poem"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#poem-1">标签语法</button></li><li class="tab"><button type="button" data-href="#poem-2">参数配置</button></li><li class="tab active"><button type="button" data-href="#poem-3">样式预览</button></li><li class="tab"><button type="button" data-href="#poem-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="poem-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% poem [title],[author] %}</span><br><span class="line">诗词内容</span><br><span class="line">{% endpoem %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="poem-2"><ol><li>title:诗词标题</li><li>author:作者,可以不写</li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="poem-3"><div class='poem'><div class='poem-title'>水调歌头</div><div class='poem-author'>苏轼</div><p>明月几时有?把酒问青天。<br>不知天上宫阙,今夕是何年?<br>我欲乘风归去,又恐琼楼玉宇,高处不胜寒。<br>起舞弄清影,何似在人间?<br>转朱阁,低绮户,照无眠。<br>不应有恨,何事长向别时圆?<br>人有悲欢离合,月有阴晴圆缺,此事古难全。<br>但愿人长久,千里共婵娟。</p></div><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="poem-4"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br></pre></td><td class="code"><pre><span class="line">{% poem 水调歌头,苏轼 %}</span><br><span class="line">丙辰中秋,欢饮达旦,大醉,作此篇,兼怀子由。</span><br><span class="line">明月几时有?把酒问青天。</span><br><span class="line">不知天上宫阙,今夕是何年?</span><br><span class="line">我欲乘风归去,又恐琼楼玉宇,高处不胜寒。</span><br><span class="line">起舞弄清影,何似在人间?</span><br><span class="line"></span><br><span class="line">转朱阁,低绮户,照无眠。</span><br><span class="line">不应有恨,何事长向别时圆?</span><br><span class="line">人有悲欢离合,月有阴晴圆缺,此事古难全。</span><br><span class="line">但愿人长久,千里共婵娟。</span><br><span class="line">{% endpoem %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="阿里图标-icon"><a href="#阿里图标-icon" class="headerlink" title="阿里图标 icon"></a>阿里图标 icon</h2><div class="tip cogs"><p>本标签的图标需要自己额外引入阿里矢量图标库的样式,具体引入方案请移步:<a href="/posts/d2ebecef/">Hexo引入阿里矢量图标库</a></p></div><div class="tabs" id="icon示例"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#icon示例-1">标签语法</button></li><li class="tab"><button type="button" data-href="#icon示例-2">参数释义</button></li><li class="tab active"><button type="button" data-href="#icon示例-3">样式预览</button></li><li class="tab"><button type="button" data-href="#icon示例-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="icon示例-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% icon [icon-xxxx],[font-size] %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="icon示例-2"><ol><li><code>icon-xxxx</code>:表示图标<code>font-class</code>,可以在自己的阿里矢量图标库项目的<code>font-class</code>引用方案内查询并复制。</li><li><code>font-size</code>:表示图标大小,直接填写数字即可,单位为<code>em</code>。图标大小默认值为<code>1em</code>。</li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="icon示例-3"><div class="table-container"><table><thead><tr><th style="text-align:left"><svg class="icon" style="width:1em; height:1em" aria-hidden="true"><use xlink:href="#icon-rat_zi"></use></svg></th><th style="text-align:left"><svg class="icon" style="width:2em; height:2em" aria-hidden="true"><use xlink:href="#icon-rat"></use></svg></th><th style="text-align:left"><svg class="icon" style="width:3em; height:3em" aria-hidden="true"><use xlink:href="#icon-ox_chou"></use></svg></th><th style="text-align:left"><svg class="icon" style="width:4em; height:4em" aria-hidden="true"><use xlink:href="#icon-ox"></use></svg></th><th style="text-align:left"><svg class="icon" style="width:5em; height:5em" aria-hidden="true"><use xlink:href="#icon-tiger_yin"></use></svg></th><th style="text-align:left"><svg class="icon" style="width:6em; height:6em" aria-hidden="true"><use xlink:href="#icon-tiger"></use></svg></th></tr></thead><tbody><tr><td style="text-align:left"><svg class="icon" style="width:1em; height:1em" aria-hidden="true"><use xlink:href="#icon-rabbit_mao"></use></svg></td><td style="text-align:left"><svg class="icon" style="width:2em; height:2em" aria-hidden="true"><use xlink:href="#icon-rabbit"></use></svg></td><td style="text-align:left"><svg class="icon" style="width:3em; height:3em" aria-hidden="true"><use xlink:href="#icon-dragon_chen"></use></svg></td><td style="text-align:left"><svg class="icon" style="width:4em; height:4em" aria-hidden="true"><use xlink:href="#icon-dragon"></use></svg></td><td style="text-align:left"><svg class="icon" style="width:5em; height:5em" aria-hidden="true"><use xlink:href="#icon-snake_si"></use></svg></td><td style="text-align:left"><svg class="icon" style="width:6em; height:6em" aria-hidden="true"><use xlink:href="#icon-snake"></use></svg></td></tr><tr><td style="text-align:left"><svg class="icon" style="width:1em; height:1em" aria-hidden="true"><use xlink:href="#icon-horse_wu"></use></svg></td><td style="text-align:left"><svg class="icon" style="width:2em; height:2em" aria-hidden="true"><use xlink:href="#icon-horse"></use></svg></td><td style="text-align:left"><svg class="icon" style="width:3em; height:3em" aria-hidden="true"><use xlink:href="#icon-goat_wei"></use></svg></td><td style="text-align:left"><svg class="icon" style="width:4em; height:4em" aria-hidden="true"><use xlink:href="#icon-goat"></use></svg></td><td style="text-align:left"><svg class="icon" style="width:5em; height:5em" aria-hidden="true"><use xlink:href="#icon-monkey_shen"></use></svg></td><td style="text-align:left"><svg class="icon" style="width:6em; height:6em" aria-hidden="true"><use xlink:href="#icon-monkey"></use></svg></td></tr><tr><td style="text-align:left"><svg class="icon" style="width:1em; height:1em" aria-hidden="true"><use xlink:href="#icon-rooster_you"></use></svg></td><td style="text-align:left"><svg class="icon" style="width:2em; height:2em" aria-hidden="true"><use xlink:href="#icon-rooster"></use></svg></td><td style="text-align:left"><svg class="icon" style="width:3em; height:3em" aria-hidden="true"><use xlink:href="#icon-dog_xu"></use></svg></td><td style="text-align:left"><svg class="icon" style="width:4em; height:4em" aria-hidden="true"><use xlink:href="#icon-dog"></use></svg></td><td style="text-align:left"><svg class="icon" style="width:5em; height:5em" aria-hidden="true"><use xlink:href="#icon-boar_hai"></use></svg></td><td style="text-align:left"><svg class="icon" style="width:6em; height:6em" aria-hidden="true"><use xlink:href="#icon-boar"></use></svg></td></tr></tbody></table></div><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="icon示例-4"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br></pre></td><td class="code"><pre><span class="line">{% icon icon-rat<span class="emphasis">_zi %}{% icon icon-rat,2 %}</span></span><br><span class="line"><span class="emphasis"></span></span><br><span class="line"><span class="emphasis">{% icon icon-ox_</span>chou,3 %}{% icon icon-ox,4 %}</span><br><span class="line"></span><br><span class="line">{% icon icon-tiger<span class="emphasis">_yin,5 %}{% icon icon-tiger,6 %}</span></span><br><span class="line"><span class="emphasis"></span></span><br><span class="line"><span class="emphasis">{% icon icon-rabbit_</span>mao,1 %}{% icon icon-rabbit,2 %}</span><br><span class="line"></span><br><span class="line">{% icon icon-dragon<span class="emphasis">_chen,3 %}{% icon icon-dragon,4 %}</span></span><br><span class="line"><span class="emphasis"></span></span><br><span class="line"><span class="emphasis">{% icon icon-snake_</span>si,5 %}{% icon icon-snake,6 %}</span><br><span class="line"></span><br><span class="line">{% icon icon-horse<span class="emphasis">_wu %}{% icon icon-horse,2 %}</span></span><br><span class="line"><span class="emphasis"></span></span><br><span class="line"><span class="emphasis">{% icon icon-goat_</span>wei,3 %}{% icon icon-goat,4 %}</span><br><span class="line"></span><br><span class="line">{% icon icon-monkey<span class="emphasis">_shen,5 %}{% icon icon-monkey,6 %}</span></span><br><span class="line"><span class="emphasis"></span></span><br><span class="line"><span class="emphasis">{% icon icon-rooster_</span>you %}{% icon icon-rooster,2 %}</span><br><span class="line"></span><br><span class="line">{% icon icon-dog<span class="emphasis">_xu,3 %}{% icon icon-dog,4 %}</span></span><br><span class="line"><span class="emphasis"></span></span><br><span class="line"><span class="emphasis">{% icon icon-boar_</span>hai,5 %}{% icon icon-boar,6 %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="特效标签wow"><a href="#特效标签wow" class="headerlink" title="特效标签wow"></a>特效标签wow</h2><div class="note blue icon-padding modern"><i class="note-icon fas fa-bullhorn"></i><p>特效标签的静态资源未添加在本帖的配置内容中(因为多为cdn配置),请移步站内教程完成相关配置:</p><div class="tag link"><a class="link-card" title="使用wowjs给博客添加动画效果" href="/posts/abab51cf/"><div class="left"><img src="https://npm.elemecdn.com/akilar-candyassets/image/siteicon/favicon.ico"/></div><div class="right"><p class="text">使用wowjs给博客添加动画效果</p><p class="url">/posts/abab51cf/</p></div></a></div></div><div class="tabs" id="animate"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#animate-1">标签语法</button></li><li class="tab"><button type="button" data-href="#animate-2">参数配置</button></li><li class="tab active"><button type="button" data-href="#animate-3">样式预览</button></li><li class="tab"><button type="button" data-href="#animate-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="animate-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% wow [animete],[duration],[delay],[offset],[iteration] %}</span><br><span class="line">内容</span><br><span class="line">{% endwow %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="animate-2"><ol><li><code>animate</code>: 动画样式,效果详见<a href="https://animate.style/">animate.css参考文档</a></li><li><code>duration</code>: 选填项,动画持续时间,单位可以是<code>ms</code>也可以是<code>s</code>。例如<code>3s</code>,<code>700ms</code>。</li><li><code>delay</code>: 选填项,动画开始的延迟时间,单位可以是<code>ms</code>也可以是<code>s</code>。例如<code>3s</code>,<code>700ms</code>。</li><li><code>offset</code>: 选填项,开始动画的距离(相对浏览器底部)</li><li><code>iteration</code>: 选填项,动画重复的次数</li></ol><div class="note warning flat"><p>注意,后面四个虽然是选填项,但是当有跨位选填时,次序不能乱。详见示例。<br>支持嵌套其他外挂标签。</p></div><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="animate-3"><ol><li><code>flip</code>动画效果。<div class='wow animate__flip' data-wow-duration='' data-wow-delay='' data-wow-offset='' data-wow-iteration='' > <div class="note green icon-padding modern"><i class="note-icon fas fa-fan"></i><p><code>flip</code>动画效果。</p></div></div></li><li><code>zoomIn</code>动画效果,持续<code>5s</code>,延时<code>5s</code>,离底部<code>100</code>距离时启动,重复<code>10</code>次。<div class='wow animate__zoomIn' data-wow-duration='5s' data-wow-delay='5s' data-wow-offset='100' data-wow-iteration='10' > <div class="note blue icon-padding modern"><i class="note-icon fas fa-bullhorn"></i><p><code>zoomIn</code>动画效果,持续<code>5s</code>,延时<code>5s</code>,离底部<code>100</code>距离时启动,重复<code>10</code>次</p></div></div></li><li><code>slideInRight</code>动画效果,持续<code>5s</code>,延时<code>5s</code>。<div class='wow animate__slideInRight' data-wow-duration='5s' data-wow-delay='5s' data-wow-offset='' data-wow-iteration='' > <div class="note orange icon-padding modern"><i class="note-icon fas fa-car"></i><p><code>slideInRight</code>动画效果,持续<code>5s</code>,延时<code>5s</code>。</p></div></div></li><li><code>heartBeat</code>动画效果,延时<code>5s</code>,重复<code>10</code>次。<div class='wow animate__heartBeat' data-wow-duration='' data-wow-delay='5s' data-wow-offset='' data-wow-iteration='10' > <div class="note red icon-padding modern"><i class="note-icon fas fa-battery-half"></i><p><code>heartBeat</code>动画效果,延时<code>5s</code>,重复<code>10</code>次。</p></div></div></li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="animate-4"><ol><li><code>flip</code>动画效果。<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">{% wow animate<span class="strong">__flip %}</span></span><br><span class="line"><span class="strong">{% note green 'fas fa-fan' modern%}</span></span><br><span class="line"><span class="strong">`flip`动画效果。</span></span><br><span class="line"><span class="strong">{% endnote %}</span></span><br><span class="line"><span class="strong">{% endwow %}</span></span><br></pre></td></tr></table></figure></li><li><code>zoomIn</code>动画效果,持续<code>5s</code>,延时<code>5s</code>,离底部<code>100</code>距离时启动,重复<code>10</code>次。<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">{% wow animate<span class="strong">__zoomIn,5s,5s,100,10 %}</span></span><br><span class="line"><span class="strong">{% note blue 'fas fa-bullhorn' modern%}</span></span><br><span class="line"><span class="strong">`zoomIn`动画效果,持续`5s`,延时`5s`,离底部`100`距离时启动,重复`10`次</span></span><br><span class="line"><span class="strong">{% endnote %}</span></span><br><span class="line"><span class="strong">{% endwow %}</span></span><br></pre></td></tr></table></figure></li><li><code>slideInRight</code>动画效果,持续<code>5s</code>,延时<code>5s</code>。<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">{% wow animate<span class="strong">__slideInRight,5s,5s %}</span></span><br><span class="line"><span class="strong">{% note orange 'fas fa-car' modern%}</span></span><br><span class="line"><span class="strong">`slideInRight`动画效果,持续`5s`,延时`5s`。</span></span><br><span class="line"><span class="strong">{% endnote %}</span></span><br><span class="line"><span class="strong">{% endwow %}</span></span><br></pre></td></tr></table></figure></li><li><code>heartBeat</code>动画效果,延时<code>5s</code>,重复<code>10</code>次。此处注意不用的参数位置要留空,用逗号间隔。<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">{% wow animate<span class="strong">__heartBeat,,5s,,10 %}</span></span><br><span class="line"><span class="strong">{% note red 'fas fa-battery-half' modern%}</span></span><br><span class="line"><span class="strong">`heartBeat`动画效果,延时`5s`,重复`10`次。</span></span><br><span class="line"><span class="strong">{% endnote %}</span></span><br><span class="line"><span class="strong">{% endwow %}</span></span><br></pre></td></tr></table></figure></li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="进度条-progress"><a href="#进度条-progress" class="headerlink" title="进度条 progress"></a>进度条 progress</h2><div class="note info morden flat"><p>进度条标签参考<a href="https://rongbuqiu.com/jdt.html">沂佰孜猫-给HEXO文章添加彩色进度条</a>。<br>源样式提取自<a href="https://zwying0814.gitbook.io/cuteen/">Cuteen</a>主题。</p></div><div class="tabs" id="progress"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#progress-1">标签语法</button></li><li class="tab"><button type="button" data-href="#progress-2">参数配置</button></li><li class="tab active"><button type="button" data-href="#progress-3">样式预览</button></li><li class="tab"><button type="button" data-href="#progress-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="progress-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% progress [width] [color] [text] %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="progress-2"><p><code>width</code>: 0到100的阿拉伯数字<br><code>color</code>: 颜色,取值有<span class='p red'>red</span>,<span class='p yellow'>yellow</span>,<span class='p green'>green</span>,<span class='p cyan'>cyan</span>,<span class='p blue'>blue</span>,<span class='p gray'>gray</span><br><code>text</code>:进度条上的文字内容</p><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="progress-3"><div class="progress"><div class="progress-bar-animated progress-bar progress-bar-striped bg-red" style="width: 10%" aria-valuenow="10" aria-valuemin="0" aria-valuemax="100"><p>进度条样式预览</p></div></div><div class="progress"><div class="progress-bar-animated progress-bar progress-bar-striped bg-yellow" style="width: 30%" aria-valuenow="30" aria-valuemin="0" aria-valuemax="100"><p>进度条样式预览</p></div></div><div class="progress"><div class="progress-bar-animated progress-bar progress-bar-striped bg-green" style="width: 50%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"><p>进度条样式预览</p></div></div><div class="progress"><div class="progress-bar-animated progress-bar progress-bar-striped bg-cyan" style="width: 70%" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100"><p>进度条样式预览</p></div></div><div class="progress"><div class="progress-bar-animated progress-bar progress-bar-striped bg-blue" style="width: 90%" aria-valuenow="90" aria-valuemin="0" aria-valuemax="100"><p>进度条样式预览</p></div></div><div class="progress"><div class="progress-bar-animated progress-bar progress-bar-striped bg-gray" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"><p>进度条样式预览</p></div></div><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="progress-4"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line">{% progress 10 red 进度条样式预览 %}</span><br><span class="line">{% progress 30 yellow 进度条样式预览 %}</span><br><span class="line">{% progress 50 green 进度条样式预览 %}</span><br><span class="line">{% progress 70 cyan 进度条样式预览 %}</span><br><span class="line">{% progress 90 blue 进度条样式预览 %}</span><br><span class="line">{% progress 100 gray 进度条样式预览 %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="注释-notation"><a href="#注释-notation" class="headerlink" title="注释 notation"></a>注释 notation</h2><div class="tabs" id="notation"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#notation-1">标签语法</button></li><li class="tab"><button type="button" data-href="#notation-2">参数配置</button></li><li class="tab active"><button type="button" data-href="#notation-3">样式预览</button></li><li class="tab"><button type="button" data-href="#notation-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="notation-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% nota [label] , [text] %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="notation-2"><p><code>label</code>: 注释词汇<br><code>text</code>: 悬停显示的注解内容</p><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="notation-3"><p><span class='nota' data-nota='可以看到注解内容出现在顶栏'>把鼠标移动到我上面试试</span></p><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="notation-4"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% nota 把鼠标移动到我上面试试 ,可以看到注解内容出现在顶栏 %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="气泡注释-bubble"><a href="#气泡注释-bubble" class="headerlink" title="气泡注释 bubble"></a>气泡注释 bubble</h2><div class="tabs" id="bubble"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#bubble-1">标签语法</button></li><li class="tab"><button type="button" data-href="#bubble-2">参数配置</button></li><li class="tab active"><button type="button" data-href="#bubble-3">样式预览</button></li><li class="tab"><button type="button" data-href="#bubble-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="bubble-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% bubble [content] , [notation] ,[background-color] %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="bubble-2"><p><code>content</code>: 注释词汇<br><code>notation</code>: 悬停显示的注解内容<br><code>background-color</code>: 可选,气泡背景色。默认为“#71a4e3”</p><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="bubble-3"><p>最近我学到了不少新玩意儿(虽然对很多大佬来说这些已经是旧技术了),比如 CSS 的<span class="bubble-content">兄弟相邻选择器</span><span class="bubble-notation"><span class="bubble-item" style="background-color:#71a4e3;">例如 h1 + p {margin-top:50px;}</span></span>,<span class="bubble-content">flex 布局</span><span class="bubble-notation"><span class="bubble-item" style="background-color:#ec5830;"> Flex 是 Flexible Box 的缩写,意为弹性布局 ",用来为盒状模型提供最大的灵活性"</span></span>,<span class="bubble-content">transform 变换</span><span class="bubble-notation"><span class="bubble-item" style="background-color:#1db675;"> transform 属性向元素应用 2D 或 3D 转换。该属性允许我们对元素进行旋转、缩放、移动或倾斜。</span></span>,animation 的<span class="bubble-content">贝塞尔速度曲线</span><span class="bubble-notation"><span class="bubble-item" style="background-color:#de4489;">贝塞尔曲线 (Bézier curve),又称贝兹曲线或贝济埃曲线,是应用于二维图形应用程序的数学曲线。一般的矢量图形软件通过它来精确画出曲线,贝兹曲线由线段与节点组成,节点是可拖动的支点,线段像可伸缩的皮筋</span></span>写法,还有今天刚看到的<span class="bubble-content"> clip-path</span><span class="bubble-notation"><span class="bubble-item" style="background-color:#868fd7;">clip-path 属性使用裁剪方式创建元素的可显示区域。区域内的部分显示,区域外的隐藏。</span></span>属性。这些对我来说很新颖的概念狠狠的冲击着我以前积累起来的设计思路。</p><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="bubble-4"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">最近我学到了不少新玩意儿(虽然对很多大佬来说这些已经是旧技术了),比如CSS的{% bubble 兄弟相邻选择器,"例如 h1 + p {margin-top:50px;}" %},{% bubble flex布局,"Flex 是 Flexible Box 的缩写,意为"弹性布局",用来为盒状模型提供最大的灵活性","#ec5830" %},{% bubble transform变换,"transform 属性向元素应用 2D 或 3D 转换。该属性允许我们对元素进行旋转、缩放、移动或倾斜。","#1db675" %},animation的{% bubble 贝塞尔速度曲线,"贝塞尔曲线(Bézier curve),又称贝兹曲线或贝济埃曲线,是应用于二维图形应用程序的数学曲线。一般的矢量图形软件通过它来精确画出曲线,贝兹曲线由线段与节点组成,节点是可拖动的支点,线段像可伸缩的皮筋","#de4489" %}写法,还有今天刚看到的{% bubble clip-path,"clip-path属性使用裁剪方式创建元素的可显示区域。区域内的部分显示,区域外的隐藏。","#868fd7" %}属性。这些对我来说很新颖的概念狠狠的冲击着我以前积累起来的设计思路。</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="引用文献-reference"><a href="#引用文献-reference" class="headerlink" title="引用文献 reference"></a>引用文献 reference</h2><div class="tabs" id="bubble"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#bubble-1">标签语法</button></li><li class="tab"><button type="button" data-href="#bubble-2">参数配置</button></li><li class="tab active"><button type="button" data-href="#bubble-3">样式预览</button></li><li class="tab"><button type="button" data-href="#bubble-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="bubble-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% referto [id] , [literature] %}</span><br><span class="line">{% referfrom [id] , [literature] , [url] %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="bubble-2"><div class="tip ban"><p>考虑到锚点跳转的特性,不建议您将引用出处标签referfrom写在常隐外挂标签(如folding、tab、hideToggle)中,这样能有效避免跳转失败。</p></div><ol><li><p>referto 引用上标<br><code>id</code>: 上标序号内容,需与referfrom标签的id对应才能实现跳转<br><code>literature</code>: 引用的参考文献名称</p></li><li><p>referfrom 引用出处<br><code>id</code>: 序号内容,需与referto标签的id对应才能实现跳转<br><code>literature</code>: 引用的参考文献名称<br><code>url</code>: 引用的参考文献链接,可省略</p></li></ol><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="bubble-3"><p>Akilarの糖果屋(akilar.top)是一个私人性质的博客<span class="hidden-anchor" id="referto_[1]"></span><sup class="reference"><a href="#referfrom_[1]" data-pjax-state="">[1]</a></sup><span class="reference-bubble"><span class="reference-item"><span class="reference-literature">Akilarの糖果屋群聊简介</span><span class="reference-title">参考资料</span></span></span>,从各类教程至生活点滴,无话不谈。建群的目的是提供一个闲聊的场所。博客采用Hexo框架<span class="hidden-anchor" id="referto_[2]"></span><sup class="reference"><a href="#referfrom_[2]" data-pjax-state="">[2]</a></sup><span class="reference-bubble"><span class="reference-item"><span class="reference-literature">Hexo中文文档</span><span class="reference-title">参考资料</span></span></span>,Butterfly主题<span class="hidden-anchor" id="referto_[3]"></span><sup class="reference"><a href="#referfrom_[3]" data-pjax-state="">[3]</a></sup><span class="reference-bubble"><span class="reference-item"><span class="reference-literature">Butterfly 安装文档(一) 快速开始</span><span class="reference-title">参考资料</span></span></span></p><p>本项目参考了Volantis<span class="hidden-anchor" id="referto_[4]"></span><sup class="reference"><a href="#referfrom_[4]" data-pjax-state="">[4]</a></sup><span class="reference-bubble"><span class="reference-item"><span class="reference-literature">hexo-theme-volantis 标签插件</span><span class="reference-title">参考资料</span></span></span>的标签样式。引入<code>[tag].js</code>,并针对<code>butterfly</code>主题修改了相应的<code>[tag].styl</code>。在此鸣谢<code>Volantis</code>主题众开发者。<br>主要参考内容包括各个volantis的内置标签插件文档<span class="hidden-anchor" id="referto_[5]"></span><sup class="reference"><a href="#referfrom_[5]" data-pjax-state="">[5]</a></sup><span class="reference-bubble"><span class="reference-item"><span class="reference-literature">Volantis文档:内置标签插件</span><span class="reference-title">参考资料</span></span></span><br>Butterfly主题的各个衍生魔改<span class="hidden-anchor" id="referto_[6]"></span><sup class="reference"><a href="#referfrom_[6]" data-pjax-state="">[6]</a></sup><span class="reference-bubble"><span class="reference-item"><span class="reference-literature">Butterfly 安装文档:标签外挂(Tag Plugins</span><span class="reference-title">参考资料</span></span></span><span class="hidden-anchor" id="referto_[7]"></span><sup class="reference"><a href="#referfrom_[7]" data-pjax-state="">[7]</a></sup><span class="reference-bubble"><span class="reference-item"><span class="reference-literature">小弋の生活馆全样式预览</span><span class="reference-title">参考资料</span></span></span><span class="hidden-anchor" id="referto_[8]"></span><sup class="reference"><a href="#referfrom_[8]" data-pjax-state="">[8]</a></sup><span class="reference-bubble"><span class="reference-item"><span class="reference-literature">l-lin-font-awesome-animation</span><span class="reference-title">参考资料</span></span></span><span class="hidden-anchor" id="referto_[9]"></span><sup class="reference"><a href="#referfrom_[9]" data-pjax-state="">[9]</a></sup><span class="reference-bubble"><span class="reference-item"><span class="reference-literature">小康的butterfly主题使用文档</span><span class="reference-title">参考资料</span></span></span></p><div class="reference-source"><span class="hidden-anchor" id="referfrom_[1]"></span><a class="reference-anchor" href="#referto_[1]">[1]<div class="reference-anchor-up fa-solid fa-angles-up"></div></a><a class="reference-link" href="https://jq.qq.com/?_wv=1027&k=pGLB2C0N">Akilarの糖果屋群聊简介</a></div><div class="reference-source"><span class="hidden-anchor" id="referfrom_[2]"></span><a class="reference-anchor" href="#referto_[2]">[2]<div class="reference-anchor-up fa-solid fa-angles-up"></div></a><a class="reference-link" href="https://hexo.io/zh-cn/docs/">Hexo中文文档</a></div><div class="reference-source"><span class="hidden-anchor" id="referfrom_[3]"></span><a class="reference-anchor" href="#referto_[3]">[3]<div class="reference-anchor-up fa-solid fa-angles-up"></div></a><a class="reference-link" href="https://butterfly.js.org/posts/21cfbf15/">Butterfly 安装文档(一) 快速开始</a></div><div class="reference-source"><span class="hidden-anchor" id="referfrom_[4]"></span><a class="reference-anchor" href="#referto_[4]">[4]<div class="reference-anchor-up fa-solid fa-angles-up"></div></a><a class="reference-link" href="https://volantis.js.org/v5/tag-plugins/">hexo-theme-volantis 标签插件</a></div><div class="reference-source"><span class="hidden-anchor" id="referfrom_[5]"></span><a class="reference-anchor" href="#referto_[5]">[5]<div class="reference-anchor-up fa-solid fa-angles-up"></div></a><a class="reference-link" href="https://volantis.js.org/tag-plugins/">Volantis文档:内置标签插件</a></div><div class="reference-source"><span class="hidden-anchor" id="referfrom_[6]"></span><a class="reference-anchor" href="#referto_[6]">[6]<div class="reference-anchor-up fa-solid fa-angles-up"></div></a><a class="reference-link" href="https://butterfly.js.org/posts/4aa8abbe/#%E6%A8%99%E7%B1%A4%E5%A4%96%E6%8E%9B%EF%BC%88Tag-Plugins%EF%BC%89">Butterfly 安装文档:标签外挂(Tag Plugins</a></div><div class="reference-source"><span class="hidden-anchor" id="referfrom_[7]"></span><a class="reference-anchor" href="#referto_[7]">[7]<div class="reference-anchor-up fa-solid fa-angles-up"></div></a><a class="reference-link" href="https://lovelijunyi.gitee.io/posts/c898.html">小弋の生活馆全样式预览</a></div><div class="reference-source"><span class="hidden-anchor" id="referfrom_[8]"></span><a class="reference-anchor" href="#referto_[8]">[8]<div class="reference-anchor-up fa-solid fa-angles-up"></div></a><a class="reference-link" href="https://github.com/l-lin/font-awesome-animation">l-lin-font-awesome-animation</a></div><div class="reference-source"><span class="hidden-anchor" id="referfrom_[9]"></span><a class="reference-anchor" href="#referto_[9]">[9]<div class="reference-anchor-up fa-solid fa-angles-up"></div></a><a class="reference-link" href="https://www.antmoe.com/posts/3b43914f/">小康的butterfly主题使用文档</a></div><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="bubble-4"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br></pre></td><td class="code"><pre><span class="line">Akilarの糖果屋(akilar.top)是一个私人性质的博客{% referto '[1]','Akilarの糖果屋群聊简介' %},从各类教程至生活点滴,无话不谈。建群的目的是提供一个闲聊的场所。博客采用Hexo框架{% referto '[2]','Hexo中文文档' %},Butterfly主题{% referto '[3]','Butterfly 安装文档(一) 快速开始' %}</span><br><span class="line"></span><br><span class="line">本项目参考了Volantis{% referto '[4]','hexo-theme-volantis 标签插件' %}的标签样式。引入<span class="code">`[tag].js`</span>,并针对<span class="code">`butterfly`</span>主题修改了相应的<span class="code">`[tag].styl`</span>。在此鸣谢<span class="code">`Volantis`</span>主题众开发者。</span><br><span class="line">主要参考内容包括各个volantis的内置标签插件文档{% referto '[5]','Volantis文档:内置标签插件' %}</span><br><span class="line">Butterfly主题的各个衍生魔改{% referto '[6]','Butterfly 安装文档:标签外挂(Tag Plugins' %}{% referto '[7]','小弋の生活馆全样式预览' %}{% referto '[8]','l-lin-font-awesome-animation' %}{% referto '[9]','小康的butterfly主题使用文档' %}</span><br><span class="line"></span><br><span class="line"></span><br><span class="line"></span><br><span class="line">{% referfrom '[1]','Akilarの糖果屋群聊简介','https://jq.qq.com/?<span class="emphasis">_wv=1027&k=pGLB2C0N' %}</span></span><br><span class="line"><span class="emphasis">{% referfrom '[2]','Hexo中文文档','https://hexo.io/zh-cn/docs/' %}</span></span><br><span class="line"><span class="emphasis">{% referfrom '[3]','Butterfly 安装文档(一) 快速开始','https://butterfly.js.org/posts/21cfbf15/' %}</span></span><br><span class="line"><span class="emphasis">{% referfrom '[4]','hexo-theme-volantis 标签插件','https://volantis.js.org/v5/tag-plugins/' %}</span></span><br><span class="line"><span class="emphasis">{% referfrom '[5]','Volantis文档:内置标签插件','https://volantis.js.org/tag-plugins/' %}</span></span><br><span class="line"><span class="emphasis">{% referfrom '[6]','Butterfly 安装文档:标签外挂(Tag Plugins','https://butterfly.js.org/posts/4aa8abbe/#%E6%A8%99%E7%B1%A4%E5%A4%96%E6%8E%9B%EF%BC%88Tag-Plugins%EF%BC%89' %}</span></span><br><span class="line"><span class="emphasis">{% referfrom '[7]','小弋の生活馆全样式预览','https://lovelijunyi.gitee.io/posts/c898.html' %}</span></span><br><span class="line"><span class="emphasis">{% referfrom '[8]','l-lin-font-awesome-animation','https://github.com/l-lin/font-awesome-animation' %}</span></span><br><span class="line"><span class="emphasis">{% referfrom '[9]','小康的butterfly主题使用文档','https://www.antmoe.com/posts/3b43914f/' %}</span></span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div><h2 id="旋转相册-carousel"><a href="#旋转相册-carousel" class="headerlink" title="旋转相册 carousel"></a>旋转相册 carousel</h2><div class="tip warning"><p>旋转相册标签与fancybox灯箱存在兼容性bug,若发现旋转相册呈扁平状,请关闭fancybox或换用medium_zoom。</p></div><div class="tabs" id="notation"><ul class="nav-tabs"><li class="tab"><button type="button" data-href="#notation-1">标签语法</button></li><li class="tab"><button type="button" data-href="#notation-2">参数配置</button></li><li class="tab active"><button type="button" data-href="#notation-3">样式预览</button></li><li class="tab"><button type="button" data-href="#notation-4">示例源码</button></li></ul><div class="tab-contents"><div class="tab-item-content" id="notation-1"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">{% carousel [Id] , [name] %}</span><br><span class="line"></span><br><span class="line"></span><br><span class="line"></span><br><span class="line">{% endcarousel %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="notation-2"><p><code>Id</code>: 相册唯一ID,用于监测相册鼠标动作。禁止使用中文。同一页内不得出现相同ID的carousel相册。<br><code>name</code>: 相册中间显示的内容,建议用英文单引号包裹。</p><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content active" id="notation-3"><p><div id="SF" class="carousel"></p><p><div id="SF-drag-container" class="drag-container"></p><p><div id="SF-spin-container" class="spin-container"><br><img src="https://npm.elemecdn.com/akilar-candyassets/image/20200907110444226.png"><br><br><img src="https://npm.elemecdn.com/akilar-candyassets/image/20200907110508327.png"><br><br><img src="https://npm.elemecdn.com/akilar-candyassets/image/20200907110525753.png"><br><br><img src="https://npm.elemecdn.com/akilar-candyassets/image/20200907110600751.png"><br><br><img src="https://npm.elemecdn.com/akilar-candyassets/image/20200907110621554.png"><br><br><img src="https://npm.elemecdn.com/akilar-candyassets/image/20200907110637459.png" ><br><br><img src="https://npm.elemecdn.com/akilar-candyassets/image/20200907110654150.png"><br><br><img src="https://npm.elemecdn.com/akilar-candyassets/image/20200907110707916.png"><br><br><img src="https://npm.elemecdn.com/akilar-candyassets/image/20200907110719787.png"><br><br><img src="https://npm.elemecdn.com/akilar-candyassets/image/20200907110731118.png"></p><p><p>strike freedom</p></p><p><div id="SF-carousel-ground" class="carousel-ground" style="width: 720px; height: 720px;"></div></div><script type="text/javascript">carouselinit('SF');</script></p><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div><div class="tab-item-content" id="notation-4"><figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br></pre></td><td class="code"><pre><span class="line">{% carousel 'SF','strike freedom' %}</span><br><span class="line"></span><br><span class="line"></span><br><span class="line"></span><br><span class="line"></span><br><span class="line"></span><br><span class="line"></span><br><span class="line"></span><br><span class="line"></span><br><span class="line"></span><br><span class="line"></span><br><span class="line">{% endcarousel %}</span><br></pre></td></tr></table></figure><button type="button" class="tab-to-top" aria-label="scroll to top"><i class="fas fa-arrow-up"></i></button></div></div></div>]]></content>
</entry>
<entry>
<title></title>
<link href="/manifest.json"/>
<url>/manifest.json</url>
<content type="html"><![CDATA[{"name":"兔老大's Blog","short_name":"RabbitBoss","theme_color":"#3b70fc","background_color":"#3b70fc","display":"standalone","scope":"/","start_url":"/","icons":[{"src":"/img/siteicon/16.png","sizes":"16x16","type":"image/png"},{"src":"/img/siteicon/32.png","sizes":"32x32","type":"image/png"},{"src":"/img/siteicon/48.png","sizes":"48x48","type":"image/png"},{"src":"/img/siteicon/64.png","sizes":"64x64","type":"image/png"},{"src":"/img/siteicon/128.png","sizes":"128x128","type":"image/png"},{"src":"/img/siteicon/144.png","sizes":"144x144","type":"image/png"},{"src":"/img/siteicon/512.png","sizes":"512x512","type":"image/png"}],"splash_pages":null}]]></content>
</entry>
<entry>
<title></title>
<link href="/css/custom.css"/>
<url>/css/custom.css</url>
<content type="html"><![CDATA[/* @font-face { font-family: Candyhome; src: url(https://npm.elemecdn.com/anzhiyu-blog@1.1.6/fonts/Candyhome.ttf); font-display: swap; font-weight: lighter;} */@font-face { font-family: ZhuZiAYuanJWD; src: url(https://npm.elemecdn.com/anzhiyu-blog@1.1.6/fonts/ZhuZiAWan.woff2); font-display: swap; font-weight: lighter; } div#menus { font-family: "ZhuZiAYuanJWD"; } h1#site-title { font-family: ZhuZiAYuanJWD; font-size: 3em !important; } a.article-title, a.blog-slider__title, a.categoryBar-list-link, h1.post-title { font-family: ZhuZiAYuanJWD; } .iconfont { font-family: "iconfont" !important; font-size: 3em; /* 可以定义图标大小 */ font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* 时间轴生肖icon */ svg.icon { /* 这里定义svg.icon,避免和Butterfly自带的note标签冲突 */ width: 1em; height: 1em; /* width和height定义图标的默认宽度和高度*/ vertical-align: -0.15em; fill: currentColor; overflow: hidden; } .icon-zhongbiao::before { color: #f7c768; } /* bilibli番剧插件 */ #article-container .bangumi-tab.bangumi-active { background: var(--anzhiyu-theme); color: var(--anzhiyu-ahoverbg); border-radius: 10px; } a.bangumi-tab:hover { text-decoration: none !important; } .bangumi-button:hover { background: var(--anzhiyu-theme) !important; border-radius: 10px !important; color: var(--anzhiyu-ahoverbg) !important; } a.bangumi-button.bangumi-nextpage:hover { text-decoration: none !important; } .bangumi-button { padding: 5px 10px !important; } a.bangumi-tab { padding: 5px 10px !important; } svg.icon.faa-tada { font-size: 1.1em; } .bangumi-info-item { border-right: 1px solid #f2b94b; } .bangumi-info-item span { color: #f2b94b; } .bangumi-info-item em { color: #f2b94b; } /* 解决artitalk的图标问题 */ #uploadSource > svg { width: 1.19em; height: 1.5em; } /*top-img黑色透明玻璃效果移除,不建议加,除非你执着于完全一图流或者背景图对比色明显 */ #page-header:not(.not-top-img):before { background-color: transparent !important; } /* 首页文章卡片 */ #recent-posts > .recent-post-item { background: rgba(255, 255, 255, 0.9); } /* 首页侧栏卡片 */ #aside-content .card-widget { background: rgba(255, 255, 255, 0.9); } /* 文章页面正文背景 */ div#post { background: rgba(255, 255, 255, 0.9); } /* 分页页面 */ div#page { background: rgba(255, 255, 255, 0.9); } /* 归档页面 */ div#archive { background: rgba(255, 255, 255, 0.9); } /* 标签页面 */ div#tag { background: rgba(255, 255, 255, 0.9); } /* 分类页面 */ div#category { background: rgba(255, 255, 255, 0.9); } /*夜间模式伪类遮罩层透明*/ [data-theme="dark"] #recent-posts > .recent-post-item { background: #121212; } [data-theme="dark"] .card-widget { background: #121212 !important; } [data-theme="dark"] div#post { background: #121212 !important; } [data-theme="dark"] div#tag { background: #121212 !important; } [data-theme="dark"] div#archive { background: #121212 !important; } [data-theme="dark"] div#page { background: #121212 !important; } [data-theme="dark"] div#category { background: #121212 !important; } [data-theme="dark"] div#category { background: transparent !important; } /* 一图流 */ /* 页脚透明 */ #footer { background: transparent !important; } /* 头图透明 */ #page-header { background: transparent !important; } /* 一图流 */ #rightside > div > button { border-radius: 5px; } /* 滚动条 */ ::-webkit-scrollbar { width: 10px; height: 10px; } ::-webkit-scrollbar-thumb { background-color: #3b70fc; border-radius: 2em; } ::-webkit-scrollbar-corner { background-color: transparent; } ::-moz-selection { color: #fff; background-color: #3b70fc; } /* 音乐播放器 */ /* .aplayer .aplayer-lrc { display: none !important; } */ .aplayer.aplayer-fixed.aplayer-narrow .aplayer-body { left: -66px !important; transition: all 0.3s; /* 默认情况下缩进左侧66px,只留一点箭头部分 */ } .aplayer.aplayer-fixed.aplayer-narrow .aplayer-body:hover { left: 0 !important; transition: all 0.3s; /* 鼠标悬停是左侧缩进归零,完全显示按钮 */ } .aplayer.aplayer-fixed { z-index: 999999 !important; } /* 评论框 */ .vwrap { box-shadow: 2px 2px 5px #bbb; background: rgba(255, 255, 255, 0.3); border-radius: 8px; padding: 30px; margin: 30px 0px 30px 0px; } /* 设置评论框 */ .vcard { box-shadow: 2px 2px 5px #bbb; background: rgba(255, 255, 255, 0.3); border-radius: 8px; padding: 30px; margin: 30px 0px 0px 0px; } /* 鼠标图标 */ body { cursor: url("/img/x1.cur"), auto; } a, [type="button"]:not(:disabled), [type="reset"]:not(:disabled), [type="submit"]:not(:disabled), button:not(:disabled) { cursor: url("/img/x2.cur"), auto !important; } /* md网站下划线 */ #article-container a:hover { text-decoration: none !important; } #article-container #hpp_talk p img { display: inline; } /* 404页面 */ #error-wrap { position: absolute; top: 40%; right: 0; left: 0; margin: 0 auto; padding: 0 1rem; max-width: 1000px; transform: translate(0, -50%); } #error-wrap .error-content { display: flex; flex-direction: row; justify-content: center; align-items: center; margin: 0 1rem; height: 18rem; border-radius: 8px; background: var(--card-bg); box-shadow: var(--card-box-shadow); transition: all 0.3s; } #error-wrap .error-content .error-img { box-flex: 1; flex: 1; height: 100%; border-top-left-radius: 8px; border-bottom-left-radius: 8px; background-color: #3b70fc; background-position: center; background-size: cover; } #error-wrap .error-content .error-info { box-flex: 1; flex: 1; padding: 0.5rem; text-align: center; font-size: 14px; font-family: Titillium Web, "PingFang SC", "Hiragino Sans GB", "Microsoft JhengHei", "Microsoft YaHei", sans-serif; } #error-wrap .error-content .error-info .error_title { margin-top: -4rem; font-size: 9em; } #error-wrap .error-content .error-info .error_subtitle { margin-top: -3.5rem; word-break: break-word; font-size: 1.6em; } #error-wrap .error-content .error-info a { display: inline-block; margin-top: 0.5rem; padding: 0.3rem 1.5rem; background: var(--btn-bg); color: var(--btn-color); } #body-wrap.error .aside-list { display: flex; flex-direction: row; flex-wrap: nowrap; bottom: 0px; position: absolute; padding: 1rem; width: 100%; overflow: scroll; } #body-wrap.error .aside-list .aside-list-group { display: flex; flex-direction: row; flex-wrap: nowrap; max-width: 1200px; margin: 0 auto; } #body-wrap.error .aside-list .aside-list-item { padding: 0.5rem; } #body-wrap.error .aside-list .aside-list-item img { width: 100%; object-fit: cover; border-radius: 12px; } #body-wrap.error .aside-list .aside-list-item .thumbnail { overflow: hidden; width: 230px; height: 143px; background: var(--anzhiyu-card-bg); display: flex; } #body-wrap.error .aside-list .aside-list-item .content .title { -webkit-line-clamp: 2; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; line-height: 1.5; justify-content: center; align-items: flex-end; align-content: center; padding-top: 0.5rem; color: white; } #body-wrap.error .aside-list .aside-list-item .content time { display: none; } /* 代码框主题 */ #article-container figure.highlight { border-radius: 10px; }]]></content>
</entry>
<entry>
<title></title>
<link href="/js/ali_font.js"/>
<url>/js/ali_font.js</url>
<content type="html"><![CDATA[!(function (c) { var l, h, a, t, i, v = '<svg><symbol id="icon-dragon_chen" viewBox="0 0 1024 1024"><path d="M512 512m-296.421053 0a296.421053 296.421053 0 1 0 592.842106 0 296.421053 296.421053 0 1 0-592.842106 0Z" fill="#D6B196" ></path><path d="M970.105263 512c0 224.983579-163.166316 412.186947-377.263158 450.533053v-54.460632C777.135158 870.507789 916.210526 707.206737 916.210526 512c0-222.881684-181.328842-404.210526-404.210526-404.210526S107.789474 289.118316 107.789474 512s181.328842 404.210526 404.210526 404.210526c9.081263 0 18.000842-0.754526 26.947368-1.374315v53.894736c-8.973474 0.538947-17.866105 1.374316-26.947368 1.374316-252.604632 0-458.105263-205.500632-458.105263-458.105263S259.395368 53.894737 512 53.894737s458.105263 205.500632 458.105263 458.105263z m-498.122105 265.620211L431.157895 754.526316V485.052632h-66.074948c-14.470737 110.645895-44.355368 197.066105-102.696421 260.742736l-39.747368-36.432842C306.526316 617.876211 323.368421 462.901895 323.368421 242.526316V215.578947h377.263158v53.894737H377.182316c-0.404211 58.260211-2.209684 112.128-6.359579 161.684211H700.631579v53.894737h-122.152421a481.172211 481.172211 0 0 0 76.826947 119.70021l66.479158-39.855158 27.728842 46.214737-54.460631 32.687158c29.507368 24.953263 63.757474 45.675789 102.80421 58.098526l-16.303158 51.361684c-134.224842-42.711579-222.773895-167.073684-261.551158-268.207157H485.052632v221.857684l68.985263-41.391158 27.728842 46.214737-109.783579 65.886316zM646.736842 377.263158h-215.578947v-53.894737h215.578947v53.894737z" fill="#231F20" ></path></symbol><symbol id="icon-dog_xu" viewBox="0 0 1024 1024"><path d="M512 512m-296.421053 0a296.421053 296.421053 0 1 0 592.842106 0 296.421053 296.421053 0 1 0-592.842106 0Z" fill="#D6B196" ></path><path d="M970.105263 512c0 224.983579-163.166316 412.186947-377.263158 450.533053v-54.460632C777.135158 870.507789 916.210526 707.206737 916.210526 512c0-222.881684-181.328842-404.210526-404.210526-404.210526S107.789474 289.118316 107.789474 512s181.328842 404.210526 404.210526 404.210526c9.081263 0 18.000842-0.754526 26.947368-1.374315v53.894736c-8.973474 0.538947-17.866105 1.374316-26.947368 1.374316-252.604632 0-458.105263-205.500632-458.105263-458.105263S259.395368 53.894737 512 53.894737s458.105263 205.500632 458.105263 458.105263z m-375.592421 150.393263c33.684211 44.544 75.210105 74.698105 124.739369 90.812632l11.425684 3.718737 10.401684-6.009264C781.204211 727.740632 808.421053 622.565053 808.421053 592.842105h-53.894737c0 22.069895-19.132632 80.869053-33.711158 103.504842-34.816-14.605474-64.538947-39.262316-89.249684-74.13221 48.316632-55.269053 92.079158-117.328842 120.535579-179.900632l-49.044211-22.285473c-23.767579 52.250947-59.742316 104.717474-100.055579 152.656842-24.010105-50.930526-41.148632-115.927579-51.658105-195.395369H700.631579v-53.894737h-155.189895A1848.050526 1848.050526 0 0 1 538.947368 161.684211h-53.894736c0 58.206316 2.155789 112.074105 6.494315 161.68421H323.368421v26.947368c0 216.549053-13.177263 263.545263-100.702316 359.046737l39.747369 36.432842c63.326316-69.093053 92.806737-118.272 105.714526-206.848H485.052632v-53.894736h-111.319579a1742.147368 1742.147368 0 0 0 3.449263-107.789474h120.158316c12.611368 98.250105 35.031579 177.475368 67.395368 238.187789-61.978947 65.536-128.053895 117.975579-173.298526 142.282106l25.519158 47.481263c47.589053-25.573053 114.095158-77.446737 177.55621-142.821053z m125.170526-411.971368l-80.842105-80.842106-38.103579 38.103579 80.842105 80.842106 38.103579-38.103579z" fill="#231F20" ></path></symbol><symbol id="icon-dog" viewBox="0 0 1024 1024"><path d="M894.814316 904.434526l83.240421-183.134315-13.824-13.204211c-0.485053-0.458105-45.648842-47.589053-47.939369-185.263158-0.134737-7.922526-0.134737-33.953684-0.134736-55.996631-30.693053 15.306105-70.090105 19.887158-106.09179 19.887157-92.752842 0-163.624421-23.983158-210.647579-71.275789a192.512 192.512 0 0 1-27.944421-36.513684H377.263158v377.263158c342.662737 0 403.105684 51.092211 494.592 128.377263 7.922526 6.682947 15.521684 13.312 22.959158 19.86021z" fill="#85C3DE" ></path><path d="M326.063158 282.947368c0 34.250105-13.231158 44.463158-29.642105 44.463158s-29.642105-10.213053-29.642106-44.463158c0-34.223158 13.231158-44.463158 29.642106-44.463157s29.642105 10.24 29.642105 44.463157zM269.473684 430.295579v311.646316L190.275368 916.210526h59.203369L323.368421 753.637053V377.263158h-26.947368c-119.403789 0-172.732632-53.382737-185.505685-107.789474h35.624421c51.092211 0 68.581053-15.764211 120.535579-62.544842 12.773053-11.506526 28.079158-25.276632 47.023158-41.741474l18.351158-15.952842-69.658947-99.139368-44.085895 30.989474 41.768421 59.472842c-11.183158 9.862737-20.884211 18.593684-29.480421 26.327579C180.736 212.156632 176.235789 215.578947 146.539789 215.578947H53.894737v26.947369c0 88.710737 66.910316 178.149053 215.578947 187.769263z m216.710737-161.414737c2.290526 71.733895 28.698947 136.326737 75.048421 182.918737C618.711579 509.628632 702.437053 538.947368 810.091789 538.947368c18.593684 0 36.190316-1.158737 52.628211-3.449263 3.745684 111.265684 33.630316 170.334316 51.496421 196.015158l-38.507789 84.722526C782.174316 742.049684 688.774737 700.631579 377.263158 700.631579v53.894737c34.277053 0 65.697684 0.512 94.639158 1.509052L374.595368 970.105263h59.203369l96.013474-211.240421c66.182737 4.338526 117.005474 11.829895 157.911578 22.016L626.229895 916.210526h59.176421l54.16421-119.134315c47.616 18.405053 79.737263 42.091789 113.125053 69.739789L805.753263 970.105263h59.203369l113.071157-248.778105-13.824-13.204211c-0.485053-0.458105-45.648842-47.589053-47.939368-185.263158C985.168842 498.553263 1024 447.811368 1024 377.263158c0-95.205053-66.506105-161.684211-161.684211-161.684211v53.894737c65.482105 0 107.789474 42.307368 107.789474 107.789474 0 89.088-87.013053 107.789474-160.013474 107.789474-92.752842 0-163.624421-23.983158-210.647578-71.27579-30.315789-30.504421-45.891368-65.832421-53.35579-98.735158 11.210105 6.952421 22.932211 13.338947 35.274105 19.186527l23.04-48.720843c-92.106105-43.654737-148.992-128.646737-219.243789-243.981473l-46.026105 28.05221c49.448421 81.246316 92.968421 148.506947 147.051789 199.302737z" fill="#231F20" ></path></symbol><symbol id="icon-goat" viewBox="0 0 1024 1024"><path d="M548.378947 646.736842a952.32 952.32 0 0 1 140.90779-161.68421H107.789474c0 107.600842 0 107.600842-63.649685 169.283368l-13.069473 12.665263L66.721684 754.526316h417.172211c20.345263-41.472 43.654737-77.446737 64.485052-107.789474z" fill="#F7C768" ></path><path d="M608.256 144.734316C555.762526 115.577263 506.098526 107.789474 485.052632 107.789474V53.894737c32.579368 0 91.270737 11.452632 149.369263 43.735579 75.290947 41.822316 130.694737 94.531368 171.385263 150.878316C755.873684 288.013474 697.101474 323.368421 646.736842 323.368421h-107.789474v-53.894737h107.789474c20.506947 0 48.424421-11.210105 80.437895-31.285895a471.04 471.04 0 0 0-118.918737-93.453473zM832.673684 342.231579c-16.384 0-29.642105 10.24-29.642105 44.463158 0 34.250105 13.231158 44.463158 29.642105 44.463158s29.642105-10.213053 29.642105-44.463158c0-34.223158-13.231158-44.463158-29.642105-44.463158zM1024 619.789474C1024 347.109053 901.066105 122.448842 686.753684 3.395368l-26.165895 47.104C914.324211 191.461053 964.688842 440.400842 969.647158 592.842105h-84.506947c-17.92-35.624421-45.352421-69.12-87.013053-101.995789l-16.788211-13.285053-16.734315 13.392842c-66.128842 52.897684-134.629053 127.083789-187.311158 209.677474H102.965895l-8.272842-20.318316C159.043368 617.013895 161.684211 603.109053 161.684211 485.052632v-53.894737h485.052631v-53.894737H161.684211c0-80.384 14.309053-110.026105 66.586947-137.916632l-25.384421-47.535158C123.365053 234.226526 107.789474 291.920842 107.789474 377.263158v107.789474c0 107.600842 0 107.600842-63.649685 169.283368l-13.069473 12.665263L110.618947 862.315789h58.206316l-43.897263-107.789473h103.477895l43.897263 107.789473h58.206316l-43.897263-107.789473h259.47621C508.981895 824.939789 485.052632 899.152842 485.052632 970.105263h53.894736c0-68.688842 27.270737-144.060632 68.958316-215.578947H687.157895c7.410526 0 13.473684 6.063158 13.473684 13.473684V862.315789h53.894737v-94.315789c0-37.160421-30.208-67.368421-67.368421-67.368421h-44.65179c40.771368-58.017684 89.438316-111.427368 138.913684-153.626947C841.512421 600.037053 862.315789 655.225263 862.315789 754.526316h53.894737c0-38.912-2.748632-74.482526-11.102315-107.789474H1024v-26.947368z" fill="#231F20" ></path></symbol><symbol id="icon-goat_wei" viewBox="0 0 1024 1024"><path d="M512 512m-296.421053 0a296.421053 296.421053 0 1 0 592.842106 0 296.421053 296.421053 0 1 0-592.842106 0Z" fill="#D6B196" ></path><path d="M970.105263 512c0 224.983579-163.166316 412.186947-377.263158 450.533053v-54.460632C777.135158 870.507789 916.210526 707.206737 916.210526 512c0-222.881684-181.328842-404.210526-404.210526-404.210526S107.789474 289.118316 107.789474 512s181.328842 404.210526 404.210526 404.210526c9.081263 0 18.000842-0.754526 26.947368-1.374315v53.894736c-8.973474 0.538947-17.866105 1.374316-26.947368 1.374316-252.604632 0-458.105263-205.500632-458.105263-458.105263S259.395368 53.894737 512 53.894737s458.105263 205.500632 458.105263 458.105263z m-431.157895 50.202947c52.304842 70.925474 136.973474 152.144842 232.528843 190.383158l19.994947-50.041263c-109.271579-43.708632-202.805895-152.629895-238.780632-217.49221H808.421053v-53.894737H538.947368v-53.894737h215.578948v-53.894737h-215.578948V161.684211h-53.894736v161.68421h-215.578948v53.894737h215.578948v53.894737H215.578947v53.894737h255.757474c-35.974737 64.862316-129.536 173.783579-238.807579 217.49221l20.021895 50.041263c95.528421-38.238316 180.197053-119.484632 232.501895-190.383158V808.421053h53.894736v-246.218106z" fill="#231F20" ></path></symbol><symbol id="icon-dragon" viewBox="0 0 1024 1024"><path d="M366.376421 344.441263l152.980211-152.98021c43.142737-43.142737 141.204211-9.216 270.201263 115.738947-15.225263 9.835789-25.114947 15.818105-44.13979 32.256s-38.076632 35.489684-59.418947 56.832c-4.203789 4.203789-51.173053 53.221053-78.740211 82.027789-10.805895-12.126316-22.743579-24.171789-34.654315-36.082526L493.136842 362.792421l-54.218105 54.218105-72.542316-72.569263zM862.315789 512c0 46.834526-45.352421 80.842105-107.789473 80.842105-108.948211 0-189.359158-28.806737-267.129263-56.697263C414.100211 509.871158 344.872421 485.052632 258.182737 485.052632 80.788211 485.052632 0 588.126316 0 683.897263h53.894737C73.216 659.779368 135.302737 646.736842 177.340632 646.736842c77.338947 0 223.124211 23.282526 291.893894 47.912421C547.462737 722.701474 615.989895 754.526316 734.315789 754.526316 862.315789 754.526316 916.210526 670.315789 916.210526 512h-53.894737z" fill="#FF8787" ></path><path d="M552.421053 1024c-69.766737 0-113.825684-13.958737-156.402527-27.459368-54.487579-17.273263-110.807579-35.004632-232.421052-26.516211l-3.826527-53.733053c131.718737-9.458526 195.934316 10.967579 252.52379 28.887579 42.226526 13.365895 78.686316 24.926316 140.126316 24.926316 92.752842 0 148.210526-57.936842 148.210526-113.960421 0-16.949895-5.524211-101.618526-114.634105-101.618526-64.970105 0-112.747789 23.336421-163.328 48.02021C365.325474 830.571789 300.301474 862.315789 204.288 862.315789 85.908211 862.315789 0 787.294316 0 683.897263 0 588.126316 80.788211 485.052632 258.182737 485.052632c86.689684 0 155.917474 24.818526 229.214316 51.09221 45.810526 16.410947 92.564211 33.172211 145.488842 44.166737 9.000421-7.033263 13.850947-16.276211 13.850947-26.758737 0-37.187368-37.672421-74.859789-74.13221-111.265684l-3.287579-3.287579 38.103579-38.103579 3.260631 3.287579C652.853895 446.275368 700.631579 494.026105 700.631579 553.552842c0 12.719158-2.802526 24.926316-7.976421 36.109474A594.997895 594.997895 0 0 0 754.526316 592.842105c62.437053 0 107.789474-34.007579 107.789473-80.842105 0-58.853053-52.870737-110.268632-108.840421-164.702316l-8.057263-7.841684c-19.024842 16.437895-38.076632 35.489684-59.418947 56.832l-38.103579-38.103579c74.805895-74.832842 134.898526-134.898526 268.314947-141.931789V55.619368c-63.407158 7.787789-120.993684 39.424-121.667368 39.801264l-15.818105 8.811789-14.120421-11.344842C731.701895 66.452211 709.712842 53.894737 673.684211 53.894737c-41.418105 0-74.347789 25.869474-109.190737 53.301895-26.624 20.911158-54.137263 42.549895-86.851369 53.194105L469.342316 161.684211h-69.093053l-105.525895 105.525894-38.103579-38.130526L324.015158 161.684211H161.684211V107.789474h303.104c22.231579-8.272842 43.708632-25.168842 66.398315-42.981053C569.829053 34.438737 613.618526 0 673.684211 0c48.909474 0 81.408 17.946947 110.888421 40.097684C813.702737 26.300632 877.729684 0 943.157895 0h26.947368v323.368421h-53.894737v-53.167158c-54.164211 3.098947-92.914526 15.845053-127.002947 36.675369l1.832421 1.778526C852.587789 368.505263 916.210526 430.376421 916.210526 512c0 60.928-43.708632 109.945263-107.789473 127.622737V700.631579h53.894736v-53.894737h53.894737v53.894737h53.894737v53.894737h-53.894737v53.894737h-53.894737v-53.894737h-53.894736c-29.722947 0-53.894737-24.171789-53.894737-53.894737v-53.894737c-118.325895 0-207.063579-31.797895-285.318737-59.877053C400.437895 562.229895 335.494737 538.947368 258.182737 538.947368 117.059368 538.947368 53.894737 611.732211 53.894737 683.897263 53.894737 757.221053 115.738947 808.421053 204.288 808.421053c11.910737 0 23.228632-0.538947 34.034526-1.536C248.454737 796.321684 269.473684 770.640842 269.473684 739.166316c0-33.118316-43.088842-70.979368-58.152421-81.596632l30.935579-44.139789c8.299789 5.793684 81.111579 58.664421 81.111579 125.736421 0 19.429053-4.527158 37.052632-10.994526 52.304842 30.773895-10.051368 58.314105-23.498105 86.662737-37.349053C452.877474 727.848421 508.577684 700.631579 585.997474 700.631579 702.410105 700.631579 754.526316 778.725053 754.526316 856.144842 754.526316 938.657684 678.912 1024 552.421053 1024z m-21.180632-623.104L493.136842 362.792421l137.889684-137.889684 38.103579 38.103579-137.889684 137.889684z m-126.760421-18.351158l-38.103579-38.103579 152.980211-152.98021 38.103579 38.103579-152.980211 152.98021z m282.004211-218.624c15.494737-9.754947 43.331368-31.447579 43.331368-31.447579-25.734737-27.809684-49.556211-33.333895-67.368421-29.07621-19.240421 4.608-37.753263 24.602947-37.753263 24.602947s42.253474 22.447158 61.790316 35.920842z" fill="#231F20" ></path></symbol><symbol id="icon-horse" viewBox="0 0 1024 1024"><path d="M776.003368 646.736842c16.599579-99.947789 43.439158-181.086316 83.213474-256.538947l6.817684-12.934737H269.473684c-36.756211 0-53.894737 54.945684-53.894737 92.05221 0 46.753684 6.656 77.527579 70.278737 176.074106l84.533895 128.269473L498.876632 646.736842h277.126736z" fill="#FFAF6E" ></path><path d="M1024 0v404.210526c0 33.333895 0 134.736842-92.079158 134.736842h-13.824l-78.362947-109.056c-22.743579 49.906526-40.340211 103.046737-53.490527 162.950737h115.092211C937.310316 592.842105 970.105263 625.637053 970.105263 661.638737c0 60.631579-69.389474 154.300632-77.312 164.75621l-43.008-32.471579C875.466105 759.861895 916.210526 693.813895 916.210526 661.638737c0-5.982316-8.919579-14.901895-14.901894-14.901895h-125.332211C761.128421 736.121263 754.526316 840.569263 754.526316 970.105263h-53.894737c0-283.971368 31.097263-453.605053 110.888421-605.049263l20.318316-38.534737 112.801684 156.995369c14.443789-4.419368 25.465263-20.938105 25.465263-79.306106V0h53.894737z m-161.684211 161.684211h53.894737V0h-53.894737v80.842105c-17.381053-14.955789-38.184421-26.947368-80.842105-26.947368h-134.736842v53.894737h134.736842c37.672421 0 80.842105 40.906105 80.842105 53.894737z m-107.789473 0h-215.578948v53.894736h161.684211l53.894737-53.894736zM300.894316 766.544842L400.680421 916.210526h64.754526l-95.043368-142.551579L498.876632 646.736842h167.855157a1212.631579 1212.631579 0 0 1 9.431579-53.894737h-199.383579l-175.885473 173.702737z m109.97221-184.400842l-37.861052-38.319158-132.419369 130.802526C173.729684 571.095579 161.684211 529.812211 161.684211 469.315368 161.684211 398.578526 199.464421 323.368421 269.473684 323.368421h323.368421l53.894737-53.894737H269.473684c-6.709895 0-13.258105 0.565895-19.698526 1.482105C234.927158 249.451789 204.638316 215.578947 160.633263 215.578947 65.967158 215.578947 0 349.291789 0 469.315368c0 70.170947 16.141474 136.650105 49.232842 202.671158L6.197895 723.833263l41.472 34.41179 66.128842-79.737264-8.704-16.033684C83.105684 622.133895 53.894737 558.214737 53.894737 469.315368 53.894737 368.451368 106.765474 269.473684 160.633263 269.473684c13.231158 0 25.815579 9.889684 35.43579 20.533895C142.874947 321.967158 107.789474 388.500211 107.789474 469.315368c0 78.201263 19.698526 130.937263 93.642105 243.981474l-55.296 54.622316L280.899368 970.105263h64.754527l-130.048-195.072 195.260631-192.889263z" fill="#231F20" ></path></symbol><symbol id="icon-monkey_shen" viewBox="0 0 1024 1024"><path d="M512 512m-296.421053 0a296.421053 296.421053 0 1 0 592.842106 0 296.421053 296.421053 0 1 0-592.842106 0Z" fill="#BBC4C9" ></path><path d="M970.105263 512c0 224.983579-163.166316 412.186947-377.263158 450.533053v-54.460632C777.135158 870.507789 916.210526 707.206737 916.210526 512c0-222.881684-181.328842-404.210526-404.210526-404.210526S107.789474 289.118316 107.789474 512s181.328842 404.210526 404.210526 404.210526c9.081263 0 18.000842-0.754526 26.947368-1.374315v53.894736c-8.973474 0.538947-17.866105 1.374316-26.947368 1.374316-252.604632 0-458.105263-205.500632-458.105263-458.105263S259.395368 53.894737 512 53.894737s458.105263 205.500632 458.105263 458.105263z m-431.157895 134.736842h161.684211v53.894737h53.894737V269.473684h-215.578948V161.684211h-53.894736v107.789473h-215.578948v431.157895h53.894737v-53.894737h161.684211v215.578947h53.894736v-215.578947z m0-161.68421h161.684211v107.789473h-161.684211v-107.789473z m-215.578947 0h161.684211v107.789473h-161.684211v-107.789473z m215.578947-161.684211h161.684211v107.789474h-161.684211v-107.789474z m-215.578947 0h161.684211v107.789474h-161.684211v-107.789474z" fill="#231F20" ></path></symbol><symbol id="icon-ox_chou" viewBox="0 0 1024 1024"><path d="M512 512m-296.421053 0a296.421053 296.421053 0 1 0 592.842106 0 296.421053 296.421053 0 1 0-592.842106 0Z" fill="#D6B196" ></path><path d="M970.105263 512c0 224.983579-163.166316 412.186947-377.263158 450.533053v-54.460632C777.135158 870.507789 916.210526 707.206737 916.210526 512c0-222.881684-181.328842-404.210526-404.210526-404.210526S107.789474 289.118316 107.789474 512s181.328842 404.210526 404.210526 404.210526c9.081263 0 18.000842-0.754526 26.947368-1.374315v53.894736c-8.973474 0.538947-17.866105 1.374316-26.947368 1.374316-252.604632 0-458.105263-205.500632-458.105263-458.105263S259.395368 53.894737 512 53.894737s458.105263 205.500632 458.105263 458.105263z m-161.68421 188.631579h-159.555369c13.985684-172.813474 43.115789-357.429895 70.817684-385.158737L700.631579 269.473684H323.368421v53.894737h107.169684c-1.940211 45.756632-8.192 103.962947-15.76421 161.684211H323.368421v53.894736h83.968c-9.862737 68.446316-20.264421 130.128842-25.734737 161.684211H215.578947v53.894737h592.842106v-53.894737z m-346.543158-161.684211h149.800421a3313.717895 3313.717895 0 0 0-16.842105 161.684211h-158.477474c6.036211-35.247158 16.114526-95.636211 25.519158-161.684211z m22.608842-215.578947h171.735579c-15.198316 41.121684-27.405474 100.594526-36.890948 161.684211h-150.123789c7.383579-57.505684 13.419789-115.361684 15.279158-161.684211z" fill="#231F20" ></path></symbol><symbol id="icon-monkey" viewBox="0 0 1024 1024"><path d="M757.733053 485.052632H565.894737a80.842105 80.842105 0 0 0-80.842105 80.842105v215.578947c0 40.96 43.546947 99.678316 77.446736 139.210105C596.426105 960.215579 603.055158 970.105263 603.055158 970.105263H754.526316s15.144421-18.674526 45.891368-58.071579S862.315789 809.984 862.315789 717.608421c0-89.573053-47.993263-166.346105-104.582736-232.555789z" fill="#C3D686" ></path><path d="M538.947368 1024h-53.894736c0-32.794947 25.869474-87.417263 77.446736-103.316211C528.599579 881.152 485.052632 822.433684 485.052632 781.473684c0-44.570947 36.271158-80.842105 80.842105-80.842105h80.842105v53.894737h-80.842105a26.947368 26.947368 0 0 0-26.947369 26.947368c0 19.725474 36.675368 77.473684 92.133053 134.736842h88.602947c20.210526-14.147368 88.737684-71.464421 88.737685-198.602105 0-108.382316-93.237895-202.967579-168.151579-278.986105-49.502316-50.202947-88.576-89.842526-98.735158-128.61979-11.749053-44.732632-21.584842-112.586105-26.327579-148.318315H377.263158c-45.136842 0-89.519158 8.434526-121.802105 53.894736H431.157895v53.894737c-97.28 0-107.789474 113.071158-107.789474 161.684211v53.894737h53.894737v161.68421h-53.894737v-107.789474h-26.947368c-170.253474 0-188.631579-94.234947-188.631579-134.736842 0-31.043368 35.220211-72.326737 55.727158-93.722947 2.694737-14.686316 5.847579-28.348632 9.431579-41.013895H161.684211V215.578947h31.528421C239.642947 120.993684 317.224421 107.789474 377.263158 107.789474h185.640421l2.802526 23.794526c0.134737 1.050947 12.719158 106.657684 27.944421 164.756211 6.494316 24.872421 44.624842 63.514947 84.965053 104.448C760.481684 483.813053 862.315789 587.129263 862.315789 717.608421c0 92.375579-31.124211 155.028211-61.898105 194.425263C904.919579 892.146526 970.105263 803.004632 970.105263 673.684211c0-91.405474-42.819368-154.381474-84.237474-215.255579C847.791158 402.458947 808.421053 344.576 808.421053 269.473684c0-119.349895 87.093895-161.684211 161.68421-161.68421v53.894737c-32.417684 0-107.789474 10.509474-107.789474 107.789473 0 58.502737 31.555368 104.933053 68.096 158.639158C974.282105 492.597895 1024 565.679158 1024 673.684211c0 177.286737-108.301474 296.421053-269.473684 296.421052h-161.684211c-37.672421 0-53.894737 40.906105-53.894737 53.894737zM229.214316 269.473684a384.808421 384.808421 0 0 0-14.012632 58.341053l-1.401263 8.488421-6.090105 6.117053c-22.878316 22.932211-44.813474 52.601263-46.026105 62.275368 0 56.805053 53.76 75.264 107.789473 79.386947V431.157895c0-58.691368 13.473684-119.619368 46.511158-161.684211h-86.770526zM323.368421 1024h-53.894737c0-32.794947 25.869474-87.417263 77.446737-103.316211C313.020632 881.152 269.473684 822.433684 269.473684 781.473684c0-44.570947 36.271158-80.842105 80.842105-80.842105h45.16379A188.847158 188.847158 0 0 1 565.894737 592.842105h134.736842v53.894737h-134.736842c-74.293895 0-134.736842 60.442947-134.736842 134.736842v26.516211l-53.894737 0.377263V781.473684c0-9.162105 0.646737-18.135579 1.913263-26.947368H350.315789c-14.848 0-26.947368 12.072421-26.947368 26.947368 0 19.725474 36.675368 77.473684 92.133053 134.736842H431.157895v53.894737h-53.894737c-37.672421 0-53.894737 40.906105-53.894737 53.894737z" fill="#231F20" ></path></symbol><symbol id="icon-horse_wu" viewBox="0 0 1024 1024"><path d="M512 512m-296.421053 0a296.421053 296.421053 0 1 0 592.842106 0 296.421053 296.421053 0 1 0-592.842106 0Z" fill="#FF8787" ></path><path d="M970.105263 512c0 224.983579-163.166316 412.186947-377.263158 450.533053v-54.460632C777.135158 870.507789 916.210526 707.206737 916.210526 512c0-222.881684-181.328842-404.210526-404.210526-404.210526S107.789474 289.118316 107.789474 512s181.328842 404.210526 404.210526 404.210526c9.081263 0 18.000842-0.754526 26.947368-1.374315v53.894736c-8.973474 0.538947-17.866105 1.374316-26.947368 1.374316-252.604632 0-458.105263-205.500632-458.105263-458.105263S259.395368 53.894737 512 53.894737s458.105263 205.500632 458.105263 458.105263z m-431.157895 26.947368h269.473685v-53.894736H538.947368v-161.684211h161.684211v-53.894737H411.001263c12.045474-33.28 20.156632-69.793684 20.156632-107.789473h-53.894737c0 121.963789-105.364211 233.391158-106.415158 234.496l38.858105 37.349052c2.883368-3.018105 43.816421-46.133895 77.392842-110.160842H485.052632v161.684211H215.578947v53.894736h269.473685v323.368421h53.894736V538.947368z" fill="#231F20" ></path></symbol><symbol id="icon-ox" viewBox="0 0 1025 1024"><path d="M540.294737 754.526316h215.578947c20.210526 0 35.112421 1.374316 53.894737 4.581052 91.863579 15.656421 145.354105 67.691789 161.684211 86.069895V916.210526h53.894736V635.580632l-7.895579-7.895579c-9.269895-9.269895-36.513684-49.232842-44.032-196.527158H540.294737a161.684211 161.684211 0 0 0-161.684211 161.68421v131.098948c43.304421 20.210526 97.28 30.585263 161.684211 30.585263z" fill="#FFAF6E" ></path><path d="M1025.347368 635.580632V916.210526h-53.894736v-71.033263c-16.330105-18.405053-69.820632-70.413474-161.684211-86.069895V916.210526h-53.894737v-161.68421h-107.789473v215.578947h-53.894737V700.631579h161.68421c100.998737 0 172.570947 38.669474 215.578948 71.868632v-115.738948c-33.684211-43.627789-51.712-137.458526-53.706106-279.498105H701.978947c-76.934737 0-127.218526-26.219789-175.804631-51.550316a1556.048842 1556.048842 0 0 0-26.839579-13.743158c-26.839579 26.004211-66.209684 44.921263-115.738948 55.511579 24.441263 22.986105 60.874105 52.116211 106.469053 72.838737l-22.312421 49.044211c-76.584421-34.816-129.589895-88.926316-150.824421-113.125053-10.644211 0.619789-21.477053 1.024-32.687158 1.024a473.734737 473.734737 0 0 1-123.365053-15.952842l-93.022315 186.314105 68.581052 53.86779C167.882105 579.557053 237.891368 538.947368 324.715789 538.947368v53.894737c-95.986526 0-170.361263 62.490947-171.088842 63.137684l-16.78821 14.282106-136.838737-107.358316 109.729684-219.809684C46.430316 314.448842 1.347368 267.371789 1.347368 199.868632 1.347368 89.815579 121.586526 53.894737 163.031579 53.894737v53.894737c-14.120421 0-107.789474 17.165474-107.789474 92.079158C55.242105 290.465684 192.188632 323.368421 284.240842 323.368421c67.907368 0 122.421895-12.988632 157.696-35.624421-42.711579-14.336-95.097263-23.120842-169.337263-18.324211l-3.503158-53.786947c95.878737-6.117053 160.148211 8.515368 211.429053 28.833684C484.244211 235.439158 486.4 225.818947 486.4 215.578947c0-48.855579-57.829053-76.288-58.394947-76.557473l22.393263-49.017263C454.063158 91.648 540.294737 131.826526 540.294737 215.578947c0 18.566737-3.422316 35.84-9.997474 51.631158 7.060211 3.584 13.985684 7.168 20.776421 10.698106C597.854316 302.322526 638.248421 323.368421 701.978947 323.368421h269.473685v26.947368c0 214.689684 35.220211 266.590316 45.999157 277.369264l7.895579 7.895579z m-729.384421 25.141894l-98.789052 118.541474 86.797473 137.835789 45.594948-28.725894-65.913263-104.690527 37.052631-44.43621C358.642526 785.192421 439.080421 808.421053 540.294737 808.421053v-53.894737c-99.893895 0-175.077053-24.549053-223.474526-72.946527l-20.857264-20.857263z" fill="#231F20" ></path></symbol><symbol id="icon-rabbit_mao" viewBox="0 0 1024 1024"><path d="M512 512m-296.421053 0a296.421053 296.421053 0 1 0 592.842106 0 296.421053 296.421053 0 1 0-592.842106 0Z" fill="#7DD47F" ></path><path d="M970.105263 512c0 224.983579-163.166316 412.186947-377.263158 450.533053v-54.460632C777.135158 870.507789 916.210526 707.206737 916.210526 512c0-222.881684-181.328842-404.210526-404.210526-404.210526S107.789474 289.118316 107.789474 512s181.328842 404.210526 404.210526 404.210526c9.081263 0 18.000842-0.754526 26.947368-1.374315v53.894736c-8.973474 0.538947-17.866105 1.374316-26.947368 1.374316-252.604632 0-458.105263-205.500632-458.105263-458.105263S259.395368 53.894737 512 53.894737s458.105263 205.500632 458.105263 458.105263z m-377.263158-188.631579h107.789474v323.368421c-20.48 0-39.936-11.264-40.016842-11.317895l-27.728842 46.214737c3.206737 1.940211 32.660211 18.997895 67.745684 18.997895 30.746947 0 53.894737-23.147789 53.894737-53.894737V269.473684h-215.578948v538.947369h53.894737V323.368421z m-107.789473 242.526316v-242.526316h-53.894737v196.904421l-107.789474 40.421053v-243.927579l169.094737-48.316632-14.821053-51.819789L269.473684 276.102737v304.801684l-36.405895 13.662316 18.917053 50.472421 178.741895-67.018105c-5.039158 69.928421-55.269053 106.981053-165.133474 122.933894l7.733895 53.328842C325.712842 746.657684 485.052632 723.536842 485.052632 565.894737z" fill="#231F20" ></path></symbol><symbol id="icon-rabbit" viewBox="0 0 1024 1024"><path d="M680.96 488.744421a1666.667789 1666.667789 0 0 0-54.433684-23.95621c-16.006737 12.234105-33.899789 20.264421-60.631579 20.264421h-80.842105c-36.810105 0-83.644632 30.396632-104.394106 67.772631-42.819368 77.123368-53.409684 117.813895-11.021473 201.701053C397.096421 808.879158 431.157895 876.409263 431.157895 970.105263h338.539789l68.338527-138.859789c20.129684-40.96 24.252632-73.701053 24.252631-110.349474 0.026947-57.397895-25.061053-159.717053-181.328842-232.151579z" fill="#FFBDD8" ></path><path d="M862.315789 720.896c0 36.621474-4.122947 69.389474-24.252631 110.349474L769.697684 970.105263H485.052632v-53.894737h48.370526C507.877053 880.074105 485.052632 833.509053 485.052632 781.473684c0-59.418947 24.171789-113.313684 63.218526-152.360421l38.103579 38.103579A161.091368 161.091368 0 0 0 538.947368 781.473684c0 54.784 35.381895 104.043789 63.514948 134.736842h133.712842l53.490526-108.759579c15.710316-31.851789 18.755368-55.834947 18.755369-86.554947 0-80.976842-63.434105-150.096842-178.607158-195.503158-17.542737 8.138105-38.292211 13.554526-63.919158 13.554526h-80.842105c-13.958737 0-43.924211 15.979789-57.290106 40.016843l-47.104-26.165895C401.408 515.449263 448.242526 485.052632 485.052632 485.052632h80.842105c37.268211 0 57.478737-15.440842 79.090526-36.45979C625.367579 336.195368 549.753263 269.473684 485.052632 269.473684h-107.789474a21.288421 21.288421 0 0 0-5.955369 2.021053A683.762526 683.762526 0 0 0 302.187789 194.021053c-35.84-34.223158-61.763368-58.933895-94.908631-79.440842A42.442105 42.442105 0 0 0 185.478737 107.789474a22.824421 22.824421 0 0 0-17.381053 7.194947c-10.913684 11.425684-6.063158 28.240842 1.428211 39.181474 21.989053 32.121263 47.912421 56.858947 83.752421 91.109052 20.614737 19.671579 49.259789 43.169684 77.392842 63.08379C281.007158 367.400421 215.578947 484.432842 215.578947 592.842105c0 74.482526 24.791579 124.065684 51.065264 176.586106C294.534737 825.209263 323.368421 882.903579 323.368421 970.105263h-53.894737c0-74.482526-24.791579-124.065684-51.065263-176.586105C190.517895 737.738105 161.684211 680.043789 161.684211 592.842105c0-90.866526 42.226526-197.685895 93.453473-274.485894a803.759158 803.759158 0 0 1-39.046737-34.115369C177.852632 247.754105 150.231579 221.399579 125.035789 184.616421c-24.441263-35.759158-22.797474-78.686316 4.069053-106.819368 26.300632-27.567158 70.898526-31.043368 106.522947-9.000421 37.941895 23.444211 65.562947 49.798737 103.774316 86.258526 9.970526 9.512421 33.037474 32.309895 56.93979 60.550737h68.634947c-27.621053-37.780211-60.416-72.730947-88.522105-99.543579-28.833684-27.540211-54.730105-52.116211-84.533895-74.024421L326.305684 0.296421c31.232 23.228632 57.802105 48.532211 87.309474 76.719158 53.840842 51.388632 94.450526 100.594526 121.74821 146.83621 82.836211 26.650947 150.042947 116.870737 165.025685 230.750316l1.724631 13.177263-9.404631 9.404632c-3.772632 3.772632-7.706947 7.653053-11.802948 11.587368C837.227789 561.178947 862.315789 663.498105 862.315789 720.896zM309.463579 754.526316c3.934316 8.057263 7.895579 16.087579 11.991579 24.144842C348.887579 832.970105 377.263158 889.128421 377.263158 970.105263h53.894737c0-93.696-34.061474-161.226105-61.520842-215.578947h-60.173474z m597.90821 53.894737c-3.422316 9.404632-7.814737 19.806316-13.770105 31.959579L829.790316 970.105263h60.065684l52.143158-105.957052c10.778947-21.935158 17.515789-40.016842 21.90821-55.727158h-56.535579zM514.694737 390.736842c0-34.223158-13.231158-44.463158-29.642105-44.463158s-29.642105 10.24-29.642106 44.463158c0 34.250105 13.231158 44.463158 29.642106 44.463158s29.642105-10.213053 29.642105-44.463158z" fill="#231F20" ></path></symbol><symbol id="icon-rat_zi" viewBox="0 0 1024 1024"><path d="M512 512m-296.421053 0a296.421053 296.421053 0 1 0 592.842106 0 296.421053 296.421053 0 1 0-592.842106 0Z" fill="#85C3DE" ></path><path d="M970.105263 512c0 224.983579-163.166316 412.186947-377.263158 450.533053v-54.460632C777.135158 870.507789 916.210526 707.206737 916.210526 512c0-222.881684-181.328842-404.210526-404.210526-404.210526S107.789474 289.118316 107.789474 512s181.328842 404.210526 404.210526 404.210526c9.081263 0 18.000842-0.754526 26.947368-1.374315v53.894736c-8.973474 0.538947-17.866105 1.374316-26.947368 1.374316-252.604632 0-458.105263-205.500632-458.105263-458.105263S259.395368 53.894737 512 53.894737s458.105263 205.500632 458.105263 458.105263z m-431.157895 188.631579v-215.578947h269.473685v-53.894737H538.947368v-39.585684c26.543158-18.081684 94.585263-65.050947 177.852632-127.488L700.631579 215.578947H323.368421v53.894737h295.316211a4221.008842 4221.008842 0 0 1-121.640421 85.369263l-11.991579 8.003369V431.157895H242.526316v53.894737h242.526316v215.578947c0 48.343579-13.850947 53.894737-134.736843 53.894737v53.894737c105.391158 0 188.631579 0 188.631579-107.789474z" fill="#231F20" ></path></symbol><symbol id="icon-rat" viewBox="0 0 1024 1024"><path d="M727.659789 431.157895c-132.581053 0-220.348632 47.454316-285.803789 154.354526-19.779368 32.309895-15.845053 76.503579-9.404632 96.579368 3.260632 10.159158 7.760842 18.647579 12.422737 25.546106C464.761263 737.010526 499.927579 754.526316 538.947368 754.526316h66.829474c1.158737 17.893053-1.967158 34.762105-15.144421 53.975579-12.692211 18.539789-37.807158 40.151579-56.32 54.810947 25.249684-0.673684 52.709053-0.997053 83.240421-0.997053C877.487158 862.315789 970.105263 711.922526 970.105263 571.176421 936.421053 512 882.364632 431.157895 727.659789 431.157895z" fill="#85C3DE" ></path><path d="M210.432 1012.897684l-43.573895-31.690105c106.954105-147.051789 185.317053-171.196632 423.828211-172.705684 21.396211-31.258947 16.249263-56.266105 9.377684-89.70779-3.557053-17.138526-7.221895-34.842947-7.221895-54.433684 0-68.958316 25.330526-104.636632 63.407158-136.973474l34.896842 41.040842c-29.453474 25.061053-44.409263 46.780632-44.409263 95.932632 0 14.093474 2.937263 28.402526 6.063158 43.546947 5.901474 28.510316 12.8 62.032842-1.131789 99.462737 166.373053-10.24 264.542316-96.902737 264.542315-236.193684C916.210526 418.330947 827.580632 323.368421 684.921263 323.368421c-83.644632 0-153.303579 29.696-174.187789 39.612632a224.875789 224.875789 0 0 1-20.533895 31.339789l-41.741474-34.115368 20.884211 17.057684-20.911158-16.976842C448.781474 359.828211 485.052632 314.287158 485.052632 262.736842c0-34.816-8.946526-60.766316-26.570106-77.069474-17.515789-16.249263-44.786526-24.602947-81.219368-24.953263V323.368421h-53.894737V109.783579l24.872421-1.913263c64.700632-4.931368 114.095158 7.895579 146.863158 38.238316C524.207158 173.056 538.947368 212.291368 538.947368 262.736842c0 11.102316-1.131789 21.908211-3.072 32.202105 37.268211-12.584421 89.842526-25.465263 149.045895-25.465263C858.165895 269.473684 970.105263 387.907368 970.105263 571.176421 970.105263 711.922526 877.487158 862.315789 617.552842 862.315789c-258.667789 0-311.942737 19.698526-407.120842 150.581895z m19.105684-256.835368c-12.045474 0-24.387368-0.565895-37.025684-1.64379l-22.096842-1.859368-2.425263-22.016C167.747368 728.144842 161.684211 672.444632 161.684211 631.026526c0-103.585684 21.450105-178.903579 53.894736-259.045052V107.789474h53.894737v274.782315l-2.021052 4.904422C235.439158 465.758316 215.578947 533.800421 215.578947 631.026526c0 22.878316 2.101895 51.442526 3.826527 70.979369 99.678316 2.802526 172.813474-35.408842 222.450526-116.493474l48.020211 24.090947c-11.237053 28.133053-11.371789 51.577263-0.377264 67.853474 9.701053 14.282105 28.645053 23.174737 49.448421 23.174737v53.894737c-39.019789 0-74.186105-17.515789-94.073263-46.888421a100.244211 100.244211 0 0 1-12.422737-25.546106c-53.221053 49.178947-121.128421 73.943579-202.913684 73.970527zM379.957895 525.473684c0-34.223158-13.231158-44.463158-29.642106-44.463158s-29.642105 10.24-29.642105 44.463158c0 34.250105 13.231158 44.463158 29.642105 44.463158s29.642105-10.213053 29.642106-44.463158z" fill="#231F20" ></path></symbol><symbol id="icon-rooster_you" viewBox="0 0 1024 1024"><path d="M512 512m-296.421053 0a296.421053 296.421053 0 1 0 592.842106 0 296.421053 296.421053 0 1 0-592.842106 0Z" fill="#BBC4C9" ></path><path d="M970.105263 512c0 224.983579-163.166316 412.186947-377.263158 450.533053v-54.460632C777.135158 870.507789 916.210526 707.206737 916.210526 512c0-222.881684-181.328842-404.210526-404.210526-404.210526S107.789474 289.118316 107.789474 512s181.328842 404.210526 404.210526 404.210526c9.081263 0 18.000842-0.754526 26.947368-1.374315v53.894736c-8.973474 0.538947-17.866105 1.374316-26.947368 1.374316-252.604632 0-458.105263-205.500632-458.105263-458.105263S259.395368 53.894737 512 53.894737s458.105263 205.500632 458.105263 458.105263z m-215.578947-188.631579h-161.684211v-26.947368h161.684211V242.526316H269.473684v53.894737h161.684211v26.947368h-161.684211v485.052632h53.894737v-53.894737h377.263158v53.894737h53.894737V323.368421zM323.368421 646.736842h377.263158v53.894737H323.368421v-53.894737z m0-269.473684h107.789474c0 103.316211-72.784842 107.654737-81.084632 107.789474L350.315789 538.947368c46.592 0 134.736842-33.792 134.736843-161.68421h53.894736v107.789474c0 29.722947 24.171789 53.894737 53.894737 53.894736h107.789474v53.894737H323.368421v-215.578947z m377.263158 0v107.789474h-107.789474v-107.789474h107.789474z m-215.578947-80.842105h53.894736v26.947368h-53.894736v-26.947368z" fill="#231F20" ></path></symbol><symbol id="icon-rooster" viewBox="0 0 1024 1024"><path d="M891.688421 506.421895C877.244632 455.033263 862.315789 401.893053 862.315789 323.368421V116.224l-323.368421 195.745684V323.368421c0 78.524632 14.928842 131.664842 29.372632 183.053474 12.611368 44.894316 24.522105 87.282526 24.522105 140.314947 0 101.618526-77.931789 176.693895-168.286316 203.991579l5.416422 11.587368h215.578947c24.333474 0 43.385263-0.242526 58.556631-2.128842C811.52 846.821053 916.210526 764.550737 916.210526 646.736842c0-53.032421-11.910737-95.420632-24.522105-140.314947z" fill="#FF8787" ></path><path d="M673.684211 354.357895c-16.384 0-29.642105-10.213053-29.642106-44.463158 0-34.223158 13.231158-44.463158 29.642106-44.463158s29.642105 10.24 29.642105 44.463158c0 34.250105-13.258105 44.463158-29.642105 44.463158zM540.106105 970.105263l-50.58021-107.789474h156.05221l50.607158 107.789474h59.553684l-51.60421-109.918316C811.52 846.821053 916.210526 764.550737 916.210526 646.736842c0-53.032421-11.910737-95.420632-24.522105-140.314947C877.244632 455.033263 862.315789 401.893053 862.315789 323.368421V107.789474c0-59.445895-48.343579-107.789474-107.789473-107.789474a107.924211 107.924211 0 0 0-107.789474 106.172632 100.890947 100.890947 0 0 0-24.117895-3.314527 88.710737 88.710737 0 0 0-88.602947 88.602948c0 20.668632 5.227789 39.720421 10.671158 53.921684l-99.489684 59.688421 93.749894 14.470737V377.263158c0 14.416842-5.901474 21.692632-33.360842 49.152l-11.129263 11.129263C398.228211 326.521263 324.985263 269.473684 215.740632 269.473684 96.768 269.473684 0 366.241684 0 485.214316V646.736842h53.894737v-161.522526A162.007579 162.007579 0 0 1 215.740632 323.368421c82.081684 0 140.422737 36.244211 240.64 152.252632l-38.615579 38.615579C367.804632 461.285053 323.098947 431.157895 259.584 431.157895A151.983158 151.983158 0 0 0 107.789474 582.952421V754.526316h53.894737v-171.573895A98.007579 98.007579 0 0 1 259.584 485.052632c46.322526 0 79.629474 20.911158 137.027368 86.016l18.970948 21.530947 128.080842-128.080842C572.200421 435.981474 592.842105 415.366737 592.842105 377.263158v-97.926737l23.309474-14.120421-13.662316-23.04c-0.161684-0.242526-14.578526-24.899368-14.578526-50.688 0-19.132632 15.575579-34.708211 34.70821-34.708211 5.093053 0 26.785684 3.179789 39.558737 18.647579l26.327579 46.026106 39.774316-24.090948-20.372211-49.367579C704.754526 140.449684 700.631579 117.517474 700.631579 107.789474c0-29.722947 24.171789-53.894737 53.894737-53.894737s53.894737 24.171789 53.894737 53.894737v215.578947c0 85.935158 16.680421 145.300211 31.366736 197.632C851.887158 564.008421 862.315789 601.141895 862.315789 646.736842c0 95.285895-99.408842 161.684211-188.631578 161.684211h-209.461895l-68.419369-145.704421C375.242105 618.954105 338.108632 592.842105 296.448 592.842105A80.976842 80.976842 0 0 0 215.578947 673.711158V862.315789h53.894737v-188.604631c0-14.874947 12.099368-26.974316 26.974316-26.974316 20.533895 0 38.965895 14.147368 50.553263 38.858105L480.579368 970.105263h59.526737z" fill="#231F20" ></path></symbol><symbol id="icon-snake_si" viewBox="0 0 1024 1024"><path d="M512 512m-296.421053 0a296.421053 296.421053 0 1 0 592.842106 0 296.421053 296.421053 0 1 0-592.842106 0Z" fill="#FF8787" ></path><path d="M970.105263 512c0 224.983579-163.166316 412.186947-377.263158 450.533053v-54.460632C777.135158 870.507789 916.210526 707.206737 916.210526 512c0-222.881684-181.328842-404.210526-404.210526-404.210526S107.789474 289.118316 107.789474 512s181.328842 404.210526 404.210526 404.210526c9.081263 0 18.000842-0.754526 26.947368-1.374315v53.894736c-8.973474 0.538947-17.866105 1.374316-26.947368 1.374316-252.604632 0-458.105263-205.500632-458.105263-458.105263S259.395368 53.894737 512 53.894737s458.105263 205.500632 458.105263 458.105263z m-242.041263 180.762947l-52.116211-13.797052C657.219368 749.864421 651.425684 754.526316 619.789474 754.526316h-242.526316V485.052632h269.473684v53.894736h53.894737V215.578947H323.368421v538.947369c0 29.722947 24.171789 53.894737 53.894737 53.894737h242.526316c77.689263 0 91.189895-51.065263 108.274526-115.658106zM377.263158 269.473684h269.473684v161.684211H377.263158v-161.684211z" fill="#231F20" ></path></symbol><symbol id="icon-tiger_yin" viewBox="0 0 1024 1024"><path d="M512 512m-296.421053 0a296.421053 296.421053 0 1 0 592.842106 0 296.421053 296.421053 0 1 0-592.842106 0Z" fill="#7DD47F" ></path><path d="M970.105263 512c0 224.983579-163.166316 412.186947-377.263158 450.533053v-54.460632C777.135158 870.507789 916.210526 707.206737 916.210526 512c0-222.881684-181.328842-404.210526-404.210526-404.210526S107.789474 289.118316 107.789474 512s181.328842 404.210526 404.210526 404.210526c9.081263 0 18.000842-0.754526 26.947368-1.374315v53.894736c-8.973474 0.538947-17.866105 1.374316-26.947368 1.374316-252.604632 0-458.105263-205.500632-458.105263-458.105263S259.395368 53.894737 512 53.894737s458.105263 205.500632 458.105263 458.105263z m-257.42821 299.250526l-107.789474-53.894737-24.117895 48.208843 107.789474 53.894736 24.117895-48.208842z m-269.473685-5.658947l-24.117894-48.208842-107.789474 53.894737 24.117895 48.208842 107.789473-53.894737zM700.631579 431.157895h-161.684211v-53.894737h107.789474v-53.894737H377.263158v53.894737h107.789474v53.894737h-161.684211v323.368421h53.894737v-53.894737h269.473684v53.894737h53.894737V431.157895z m-161.684211 161.68421h107.789474v53.894737h-107.789474v-53.894737z m-161.68421 0h107.789474v53.894737h-107.789474v-53.894737z m161.68421-107.789473h107.789474v53.894736h-107.789474v-53.894736z m-161.68421 0h107.789474v53.894736h-107.789474v-53.894736zM754.526316 215.578947h-223.097263l-20.803369-62.410105-51.119158 17.057684L474.624 215.578947H269.473684v107.789474h53.894737v-53.894737h377.263158v53.894737h53.894737V215.578947z" fill="#231F20" ></path></symbol><symbol id="icon-snake" viewBox="0 0 1024 1024"><path d="M107.789474 790.474105c0-72.434526 67.880421-91.513263 121.451789-91.513263 74.401684 0 153.815579 34.438737 237.891369 70.925474 50.580211 21.935158 104.609684 45.325474 162.250105 63.083789-52.412632 44.786526-118.784 74.347789-195.152842 83.078737-143.171368 16.357053-326.440421 7.006316-326.440421-125.574737zM377.263158 215.578947c-15.575579 0-30.288842 3.449263-43.654737 9.377685A250.691368 250.691368 0 0 0 323.368421 296.421053c0 115.550316 76.422737 169.391158 137.83579 212.614736 8.138105 5.712842 16.141474 11.371789 23.848421 17.057685V323.368421a107.789474 107.789474 0 0 0-107.789474-107.789474z" fill="#C3D686" ></path><path d="M671.528421 788.857263c44.328421 11.964632 89.626947 19.563789 136.892632 19.56379 89.168842 0 161.684211-60.442947 161.68421-134.736842s-72.515368-134.736842-161.68421-134.736843c-19.078737 0-37.025684 1.509053-54.218106 4.015158-0.754526-101.402947-38.211368-172.355368-79.413894-219.648L673.684211 323.368421a1749.962105 1749.962105 0 0 1-79.036632-1.751579c45.702737 35.866947 108.705684 107.870316 105.984 232.367158 0 0.431158-0.080842 0.808421-0.10779 1.239579-34.923789 10.994526-66.155789 26.731789-95.097263 45.190737a163.085474 163.085474 0 0 0-15.845052-42.388211c-21.557895-39.639579-60.065684-66.775579-97.360842-93.022316C433.098105 423.343158 377.263158 384 377.263158 296.421053c0-130.290526 108.274526-188.631579 215.578947-188.631579 64.134737 0 132.715789 12.045474 214.366316 37.807158C802.330947 180.250947 780.099368 209.381053 700.631579 214.635789V161.684211h-53.894737v53.679157c-63.272421-1.024-104.528842-5.200842-104.986947-5.254736l-5.578106 53.598315C538.408421 263.949474 592.357053 269.473684 673.684211 269.473684c125.170526 0 188.631579-48.128 188.631578-143.063579V106.981053l-18.432-6.144C747.789474 68.823579 668.025263 53.894737 592.842105 53.894737c-158.666105 0-269.473684 99.732211-269.473684 242.526316 0 115.550316 76.422737 169.391158 137.83579 212.614736 33.684211 23.713684 65.509053 46.106947 81.003789 74.698106 9.539368 17.542737 13.285053 33.414737 12.341895 47.750737 21.153684 9.108211 42.118737 17.839158 62.949052 25.977263C671.151158 620.193684 729.977263 592.842105 808.421053 592.842105c59.445895 0 107.789474 36.271158 107.789473 80.842106s-48.343579 80.842105-107.789473 80.842105c-105.472 0-203.237053-42.388211-297.768421-83.429053-94.800842-41.094737-184.346947-79.952842-281.411369-79.952842C122.718316 591.171368 53.894737 644.715789 53.894737 727.578947c0 79.063579 67.098947 136.434526 159.555368 136.434527 142.174316 0 230.426947-66.883368 306.79579-129.886316 31.420632 13.419789 62.787368 26.058105 94.450526 37.133474-47.077053 49.637053-110.969263 82.566737-186.610526 91.270736l5.066105 53.625264c93.453474-7.006316 143.144421 9.350737 195.718737 26.543157 46.457263 15.225263 94.127158 30.854737 169.822316 30.854737 19.994947 0 41.957053-1.077895 66.344421-3.557052l-5.416421-53.625263c-105.283368 10.778947-158.100211-6.548211-213.935158-24.872422-22.150737-7.275789-44.624842-14.632421-70.305684-20.345263a334.848 334.848 0 0 0 96.14821-82.297263z m-458.078316 21.261474C162.573474 810.118737 107.789474 784.276211 107.789474 727.578947c0-60.847158 62.733474-82.539789 121.451789-82.539789 77.850947 0 154.731789 30.288842 235.250526 64.943158-66.263579 52.924632-139.722105 100.136421-251.041684 100.136421z" fill="#231F20" ></path></symbol><symbol id="icon-tiger" viewBox="0 0 1024 1024"><path d="M431.157895 162.250105V134.736842c0-41.552842-39.289263-80.842105-80.842106-80.842105-28.833684 0-57.128421 4.661895-58.314105 4.850526L269.473684 62.490947v83.887158C144.788211 223.824842 89.222737 346.839579 66.991158 431.157895h266.051368c240.747789 0 415.851789 107.789474 415.85179 269.473684-14.848-25.114947-43.924211-53.894737-88.68379-53.894737-67.988211 0-121.263158 71.033263-121.263158 161.684211 0 66.802526 30.477474 119.888842 60.712421 156.16 12.638316 15.171368 36.055579 37.726316 59.014737 58.88 5.066105 0.107789 9.781895 0.538947 15.009685 0.538947 219.297684 0 350.315789-191.811368 350.315789-377.263158C1024 327.545263 679.855158 172.813474 431.157895 162.250105z" fill="#F7C768" ></path><path d="M673.684211 1024c-114.768842 0-188.820211-33.333895-254.167579-62.787368-53.625263-24.144842-99.974737-45.002105-161.28-45.002106-40.448 0-83.590737 23.255579-103.639579 45.16379l-39.747369-36.432842C142.497684 894.787368 199.168 862.315789 258.236632 862.315789c68.392421 0 119.861895 21.288421 172.921263 45.056V673.684211c0-35.166316-17.542737-64.107789-30.639158-80.815158-15.198316 9.835789-32.067368 18.890105-50.741895 26.947368l-21.342316-49.475368C469.800421 509.413053 485.052632 377.317053 485.052632 323.368421V221.642105A597.827368 597.827368 0 0 0 404.210526 215.578947h-26.947368V134.736842c0-12.099368-14.848-26.947368-26.947369-26.947368-9.377684 0-18.836211 0.592842-26.947368 1.347368V269.473684h-53.894737V211.671579c-136.030316 102.912-158.450526 266.886737-161.306947 295.882105 9.135158 9.108211 38.992842 25.061053 71.976421 38.669474l38.103579-59.365053 12.449684-1.589894C321.212632 473.653895 377.263158 392.192 377.263158 323.368421h53.894737c0 88.333474-68.796632 192.242526-180.870737 213.342316l-48.397474 75.398737-20.291368-7.437474C53.894737 557.756632 53.894737 523.317895 53.894737 512c0-50.041263 37.025684-254.733474 215.578947-365.621895V62.490947l22.528-3.745684C293.187368 58.556632 321.482105 53.894737 350.315789 53.894737c41.552842 0 80.842105 39.289263 80.842106 80.842105v27.513263c248.697263 10.563368 592.842105 165.295158 592.842105 484.486737 0 185.451789-131.018105 377.263158-350.315789 377.263158z m-13.473685-323.368421c-36.513684 0-67.368421 49.367579-67.368421 107.789474 0 85.746526 68.096 145.084632 89.465263 161.549473 91.540211-2.533053 164.378947-45.487158 213.827369-107.654737H700.631579v-53.894736h230.238316c8.919579-17.273263 16.357053-35.354947 22.285473-53.894737h-239.885473l-6.467369-17.650527C706.290526 735.582316 692.439579 700.631579 660.210526 700.631579zM485.052632 931.112421c33.926737 14.066526 70.521263 26.597053 114.607157 33.468632C569.424842 928.309895 538.947368 875.223579 538.947368 808.421053c0-90.650947 53.274947-161.684211 121.263158-161.684211 44.759579 0 73.835789 28.779789 88.68379 53.894737h217.007158c2.775579-17.866105 4.203789-35.920842 4.203789-53.894737 0-38.938947-5.658947-74.752-15.925895-107.627789l-126.706526 126.679579-38.103579-38.103579L932.001684 485.052632a367.939368 367.939368 0 0 0-57.775158-81.596632l-154.543158 154.543158-38.103579-38.103579 153.573053-153.573053a537.869474 537.869474 0 0 0-82.593684-56.751158l-140.665263 140.638316-38.103579-38.103579 128.134737-128.134737A794.731789 794.731789 0 0 0 538.947368 231.046737V323.368421c0 50.149053-11.102316 156.698947-95.932631 236.328421 18.378105 23.417263 42.037895 63.407158 42.037895 113.987369v257.42821zM215.578947 431.157895v-53.894737c39.774316 0 53.894737-29.022316 53.894737-53.894737h53.894737c0 53.571368-37.025684 107.789474-107.789474 107.789474z" fill="#231F20" ></path></symbol><symbol id="icon-boar" viewBox="0 0 1024 1024"><path d="M732.079158 377.263158c-107.789474 0-186.421895 31.393684-281.869474 126.841263L180.331789 773.982316C257.724632 807.909053 348.725895 808.421053 485.052632 808.421053h96.013473c55.834947-34.411789 133.551158-53.894737 227.354948-53.894737h121.344L970.105263 680.555789V572.631579c0-94.315789-130.236632-195.368421-238.026105-195.368421z" fill="#FFBDD8" ></path><path d="M808.421053 700.631579v53.894737c-196.446316 0-323.368421 84.641684-323.368421 215.578947h-53.894737c0-163.705263 148.075789-269.473684 377.263158-269.473684z m-323.368421 107.789474v-53.894737c-158.342737 0-245.598316 0-319.649685-49.367579L158.612211 700.631579H80.842105c-21.692632 0-26.624-14.821053-26.947368-26.947368v-82.620632c84.156632-11.183158 161.684211-74.913684 161.68421-186.853053V215.578947H161.684211v161.684211H134.736842c-66.964211 0-134.736842 37.025684-134.736842 107.789474h53.894737c0-42.630737 52.870737-53.894737 80.842105-53.894737h24.629895C147.132632 504.912842 85.153684 538.947368 26.947368 538.947368H0v134.736843c0 32.498526 21.530947 80.842105 80.842105 80.842105h61.682527c32.687158 20.506947 67.125895 33.145263 105.957052 41.013895A232.879158 232.879158 0 0 0 215.578947 916.210526h53.894737c0-41.930105 14.012632-80.303158 39.424-112.505263C358.885053 808.151579 415.959579 808.421053 485.052632 808.421053z m-72.946527-342.420211L323.368421 554.738526V431.157895h-53.894737v253.682526l180.736-180.736-38.103579-38.103579zM323.368421 161.684211h-53.894737v190.032842a769.536 769.536 0 0 1 53.894737-49.098106V161.684211z m323.368421-53.894737c-72.623158 0-146.809263 23.336421-215.578947 58.637473V107.789474h-53.894737v154.138947C458.832842 205.392842 555.331368 161.684211 646.736842 161.684211c148.587789 0 269.473684 120.885895 269.473684 269.473684v235.654737L809.579789 862.315789h61.359158L970.105263 680.555789V431.157895c0-178.310737-145.057684-323.368421-323.368421-323.368421z" fill="#231F20" ></path></symbol><symbol id="icon-boar_hai" viewBox="0 0 1024 1024"><path d="M512 512m-296.421053 0a296.421053 296.421053 0 1 0 592.842106 0 296.421053 296.421053 0 1 0-592.842106 0Z" fill="#85C3DE" ></path><path d="M309.975579 804.756211l-27.136-46.592c103.073684-60.011789 183.026526-132.473263 241.475368-219.24379H350.315789l-13.473684-50.283789c58.88-33.980632 99.435789-117.571368 118.703158-165.295158H242.526316v-53.894737h538.947368v53.894737h-268.18021c-12.395789 34.088421-42.469053 106.603789-90.435369 161.68421h134.009263a680.555789 680.555789 0 0 0 46.349474-107.708631l51.092211 17.057684c-58.421895 175.265684-171.034947 309.490526-344.333474 410.381474z m192.350316-2.937264L467.806316 760.454737c88.414316-73.728 154.516211-158.773895 202.105263-259.907369l48.801684 22.959158a797.372632 797.372632 0 0 1-82.351158 137.781895c32.741053 15.009684 83.456 44.867368 137.647158 101.591579l-38.938947 37.268211c-57.236211-59.877053-109.325474-85.557895-133.766737-95.178106a850.997895 850.997895 0 0 1-98.977684 96.848842z m48.613052-536.872421l-80.842105-53.894737 29.884632-44.840421 80.842105 53.894737-29.884632 44.840421zM512 53.894737C259.395368 53.894737 53.894737 259.395368 53.894737 512s205.500632 458.105263 458.105263 458.105263c9.081263 0 17.973895-0.835368 26.947368-1.374316v-53.894736c-8.946526 0.619789-17.866105 1.374316-26.947368 1.374315-222.881684 0-404.210526-181.328842-404.210526-404.210526S289.118316 107.789474 512 107.789474s404.210526 181.328842 404.210526 404.210526c0 195.206737-139.075368 358.507789-323.368421 396.045474v54.460631c214.096842-38.346105 377.263158-225.549474 377.263158-450.533052C970.105263 259.395368 764.604632 53.894737 512 53.894737z" fill="#231F20" ></path></symbol><symbol id="icon-bilibili1" viewBox="0 0 1129 1024"><path d="M234.909 9.656a80.468 80.468 0 0 1 68.398 0 167.374 167.374 0 0 1 41.843 30.578l160.937 140.82h115.07l160.936-140.82a168.983 168.983 0 0 1 41.843-30.578A80.468 80.468 0 0 1 930.96 76.445a80.468 80.468 0 0 1-17.703 53.914 449.818 449.818 0 0 1-35.406 32.187 232.553 232.553 0 0 1-22.531 18.508h100.585a170.593 170.593 0 0 1 118.289 53.109 171.397 171.397 0 0 1 53.914 118.288v462.693a325.897 325.897 0 0 1-4.024 70.007 178.64 178.64 0 0 1-80.468 112.656 173.007 173.007 0 0 1-92.539 25.75H212.377a341.186 341.186 0 0 1-72.421-4.024A177.835 177.835 0 0 1 28.91 939.065a172.202 172.202 0 0 1-27.36-92.539V388.662a360.498 360.498 0 0 1 0-66.789A177.03 177.03 0 0 1 162.487 178.64h105.414c-16.899-12.07-31.383-26.555-46.672-39.43a80.468 80.468 0 0 1-25.75-65.984 80.468 80.468 0 0 1 39.43-63.57M216.4 321.873a80.468 80.468 0 0 0-63.57 57.937 108.632 108.632 0 0 0 0 30.578v380.615a80.468 80.468 0 0 0 55.523 80.469 106.218 106.218 0 0 0 34.601 5.632h654.208a80.468 80.468 0 0 0 76.444-47.476 112.656 112.656 0 0 0 8.047-53.109v-354.06a135.187 135.187 0 0 0 0-38.625 80.468 80.468 0 0 0-52.304-54.719 129.554 129.554 0 0 0-49.89-7.242H254.22a268.764 268.764 0 0 0-37.82 0z m0 0" fill="#20B0E3" ></path><path d="M348.369 447.404a80.468 80.468 0 0 1 55.523 18.507 80.468 80.468 0 0 1 28.164 59.547v80.468a80.468 80.468 0 0 1-16.094 51.5 80.468 80.468 0 0 1-131.968-9.656 104.609 104.609 0 0 1-10.46-54.719v-80.468a80.468 80.468 0 0 1 70.007-67.593z m416.02 0a80.468 80.468 0 0 1 86.102 75.64v80.468a94.148 94.148 0 0 1-12.07 53.11 80.468 80.468 0 0 1-132.773 0 95.757 95.757 0 0 1-12.875-57.133V519.02a80.468 80.468 0 0 1 70.007-70.812z m0 0" fill="#20B0E3" ></path></symbol><symbol id="icon-yinle" viewBox="0 0 1024 1024"><path d="M512.2976 0a531.2 531.2 0 0 0-512 548.48V960h128V548.48a398.72 398.72 0 0 1 384-411.52 398.72 398.72 0 0 1 384 411.52V960h128V548.48A531.2 531.2 0 0 0 512.2976 0z" fill="#5c8add" ></path><path d="M64.2976 576l256 0 0 448-256 0 0-448Z" fill="#5c8add" ></path><path d="M704.2976 576l256 0 0 448-256 0 0-448Z" fill="#5c8add" ></path></symbol><symbol id="icon-icon-test-copy" viewBox="0 0 1024 1024"><path d="M512 512m-229.517241 0a229.517241 229.517241 0 1 0 459.034482 0 229.517241 229.517241 0 1 0-459.034482 0Z" fill="#5c8add" ></path><path d="M512 1024A512 512 0 1 1 1024 512 512 512 0 0 1 512 1024z m0-141.241379A370.758621 370.758621 0 1 0 141.241379 512 370.758621 370.758621 0 0 0 512 882.758621z" fill="#5c8add" ></path></symbol><symbol id="icon-V" viewBox="0 0 1024 1024"><path d="M1012.47774251 492.58192592L544.94137566 87.22962963a49.96686561 49.96686561 0 0 0-65.88275132 0L11.63784127 492.6975097c-21.03624691 18.26223633-23.3479224 49.93219048-5.08568606 70.96843739 18.03106878 21.03624691 49.93219048 23.3479224 70.96843738 5.08568607L512 191.83294532l434.71057495 376.91868784c9.47786949 8.20644797 21.26741446 12.25188008 32.82579189 12.13629629 14.10122046 0 27.97127337-5.77918871 38.02706173-17.33756613 18.14665256-20.92066314 15.95056084-52.70620106-5.08568606-70.9684374z" fill="#5c8add" ></path><path d="M109.30613051 567.59579541V896.89396825c0 42.53482892 34.90629982 77.44112875 77.44112875 77.44112875h220.76500882V666.30433862c0-25.54401411 20.92066314-46.46467725 46.46467724-46.46467724h116.16169313c25.54401411 0 46.46467725 20.92066314 46.46467725 46.46467724V974.335097h220.76500882c42.53482892 0 77.44112875-34.90629982 77.44112874-77.44112875l0.11558377-329.29817284L512 218.18604586 109.30613051 567.59579541zM848.00203175 197.49655027h-63.91782716c-12.82979894 0-23.23233862 10.40253968-23.23233863 23.23233862v24.27259259l110.49808818 95.70336508V220.72888889h-0.11558377c0-12.82979894-10.40253968-23.23233862-23.23233862-23.23233862zM905.44716754 83.18419754s-34.90629982 56.86721693-89.11508994 100.32671603c152.68616579 13.98563668 127.83565432-133.26809171 127.83565432-133.2680917-134.07717813-10.28695591-132.92134039 102.29164021-131.072 127.83565432 20.92066314-20.92066314 49.70102293-62.64640564 92.35143562-94.89427865zM798.53217637 174.61096297c-19.64924162-16.52847972-40.56990476-43.45949912-51.203612-53.97762258 0 0 32.94137566 20.57391182 56.40488184 49.3542716 2.42725926-18.37782011 6.47269135-93.3916896-93.16052205-85.3008254 0 0-13.98563668 104.71889947 87.95925221 89.92417638z" fill="#5c8add" ></path></symbol><symbol id="icon-zhifeiji" viewBox="0 0 1167 1024"><path d="M41.201759 463.52493L1110.665064 30.117647c10.32605-4.159104 21.942857 0.860504 26.101961 11.043137 1.434174 3.728852 1.864426 7.744538 1.003921 11.616807L949.033691 978.823529c-2.151261 10.89972-12.764146 17.927171-23.663865 15.632493-2.72493-0.573669-5.306443-1.721008-7.601121-3.298599L634.80624 789.79944l-163.065546 133.951821c-16.492997 13.62465-40.87395 11.186555-54.498599-5.306443-3.011765-3.728852-5.306443-7.887955-6.884034-12.477311l-102.973669-313.080112-265.178712-91.787115c-10.469468-3.585434-16.062745-15.058824-12.333893-25.528291 1.864426-5.44986 6.023529-9.895798 11.329972-12.047059z" fill="#FCFDFC" ></path><path d="M929.385512 1023.569748c-3.155182 0-6.453782-0.286835-9.752381-1.003922-6.740616-1.434174-12.907563-4.015686-18.50084-8.031372L635.953579 825.940616l-146.142297 120.040336c-13.911485 11.473389-31.408403 16.779832-49.335574 15.058824-17.927171-1.721008-34.133333-10.32605-45.463305-24.237535-5.306443-6.453782-9.322129-13.768067-11.903642-21.79944l-98.527731-299.598879-251.697479-87.19776c-12.333894-4.302521-22.229692-13.05098-27.966386-24.811204s-6.453782-24.954622-2.151261-37.288515c4.589356-13.337815 14.771989-23.9507 27.82297-29.257143L1099.908761 3.585434c24.954622-10.039216 53.351261 2.007843 63.533894 26.819048 3.585434 8.891877 4.445938 18.644258 2.581513 28.109804L977.143495 984.560224c-4.732773 23.090196-25.098039 39.009524-47.757983 39.009524z m-294.579272-233.770308l282.962465 201.357983c2.294678 1.577591 4.87619 2.72493 7.601121 3.298599 10.89972 2.151261 21.512605-4.87619 23.663865-15.632493L1137.914364 52.777591c0.860504-3.872269 0.430252-7.887955-1.003922-11.616807-4.159104-10.32605-15.919328-15.202241-26.101961-11.043137L41.201759 463.52493c-5.306443 2.151261-9.465546 6.597199-11.47339 12.047059-1.721008 5.019608-1.434174 10.469468 0.860505 15.345658 2.294678 4.87619 6.453782 8.461625 11.473389 10.182633l265.178711 91.787115L410.214644 905.967507c1.434174 4.589356 3.872269 8.748459 6.884033 12.477311 6.597199 8.031373 15.919328 12.907563 26.101961 13.911485 10.32605 1.003922 20.365266-2.007843 28.396639-8.605042l163.208963-133.951821z" fill="#4A4A4A" ></path><path d="M307.097557 592.743978l105.698599 316.091876c6.310364 18.787675 26.532213 28.970308 45.319888 22.659944 4.159104-1.434174 7.887955-3.442017 11.186555-6.166946l164.786555-133.951821-165.360224-118.892997c297.017367-287.982073 447.462185-433.980952 451.191036-437.853222 0.573669-0.573669 2.581513-3.442017 0.430252-7.027451-1.290756-1.577591-3.298599-3.298599-7.027451-2.15126-202.218487 120.327171-404.293557 242.805602-606.22521 367.291877z" fill="#CAE0EE" ></path><path d="M446.786072 934.794398c-5.736695 0-11.329972-1.290756-16.636414-3.872269-8.891877-4.445938-15.632493-12.047059-18.787675-21.512605L305.376549 592.313725l1.003921-0.573669C507.308201 467.684034 711.391114 344.058263 912.60568 224.161345l0.286835-0.143418c3.585434-1.147339 6.310364-0.286835 8.605042 2.581513l0.143417 0.143417c2.438095 4.015686 0.573669 7.457703-0.573669 8.74846-3.872269 4.015686-155.177591 150.87507-450.043698 436.705882l165.503642 119.036414-166.220728 135.09916c-3.442017 2.868347-7.457703 5.019608-11.760225 6.453782-3.728852 1.290756-7.744538 2.007843-11.760224 2.007843z m-137.967507-341.333334l105.268348 314.944538c2.868347 8.748459 9.035294 15.77591 17.210084 19.935014 8.17479 4.159104 17.496919 4.732773 26.245378 1.864426 3.872269-1.290756 7.60112-3.298599 10.756302-5.880112l163.352381-132.804482L466.434252 672.627451l1.290756-1.147339C763.308201 384.932213 915.043775 237.642577 918.772627 233.626891c0 0 2.007843-2.294678 0.286835-5.306443-1.003922-1.290756-2.438095-2.438095-5.306443-1.577591-200.784314 119.610084-404.293557 242.94902-604.934454 366.718207z" fill="#CAE0EE" ></path><path d="M460.840974 924.898599l7.457703-253.561904 165.933894 119.896918-168.658824 135.959664c-1.290756 1.003922-3.011765 0.860504-4.015686-0.430252-0.430252-0.430252-0.717087-1.147339-0.717087-1.864426z" fill="#94C3E2" ></path><path d="M463.709322 929.344538c-1.290756 0-2.438095-0.573669-3.2986-1.577591-0.573669-0.860504-1.003922-1.864426-1.003921-2.868348l7.60112-256.286834 169.519328 122.621848-1.434174 1.147339-168.658823 135.959664c-0.860504 0.717087-1.721008 1.003922-2.72493 1.003922z m6.023529-255.282913l-7.457703 250.836974c0 0.286835 0.143417 0.717087 0.286835 1.003922 0.430252 0.573669 1.434174 0.717087 2.007843 0.286835l167.22465-134.812325-162.061625-117.315406z" fill="#94C3E2" ></path></symbol><symbol id="icon-lianjie" viewBox="0 0 1079 1024"><path d="M695.355535 432.666896c-0.553495-1.10699-0.885592-2.186305-1.383737-3.265619-0.193723-0.193723-0.193723-0.359772-0.359771-0.719543-12.508983-26.318678-39.436506-43.366319-69.325226-41.013966-39.076734 3.265619-68.439634 39.021384-65.312388 79.841627 0.857917 10.516401 3.653066 20.147211 7.998 28.83708 19.78744 46.659613 11.097571 103.448181-25.377737 141.750022l-191.094085 199.950001a118.088119 118.088119 0 0 1-171.998513 0c-47.434506-49.537786-47.434506-130.098956 0-179.636742l71.234782-74.389703-0.52582-0.553494a75.911814 75.911814 0 0 0 24.326097-61.880721c-3.127246-40.820243-37.3609-71.51153-76.437634-68.24591a69.463599 69.463599 0 0 0-46.908685 23.966325l-0.166049-0.193723-72.618519 75.856464c-103.226783 107.793115-103.226783 282.36538 0 390.158495 103.171433 107.793115 270.299193 107.793115 373.498301 0l191.619904-200.1714c80.256748-83.992838 97.636485-208.307773 52.83108-310.289193z" fill="#5c8add" ></path><path d="M1002.047012 80.865592c-103.226783-107.82079-270.382217-107.82079-373.581325 0l-191.619905 200.199075c-80.284423 83.854464-97.66416 208.197074-52.997128 310.233843 0.52582 1.079315 0.857917 2.15863 1.383737 3.26562 0.166048 0.166048 0.166048 0.359772 0.332097 0.719543 12.536658 26.291004 39.46418 43.366319 69.3529 41.013966 39.076734-3.265619 68.439634-39.021384 65.312388-79.869302a78.679288 78.679288 0 0 0-7.998-28.864755c-19.78744-46.631938-11.097571-103.448181 25.377737-141.750022l191.287808-199.839302a118.088119 118.088119 0 0 1 172.026188 0c47.434506 49.537786 47.434506 130.126631 0 179.692091l-71.234782 74.417378 0.52582 0.553495a75.939489 75.939489 0 0 0-24.353772 61.88072c3.15492 40.847917 37.3609 71.51153 76.465309 68.245911a69.463599 69.463599 0 0 0 46.908685-23.938651l0.166049 0.166048 72.646194-75.856464c103.03306-107.82079 103.03306-282.642127 0-390.269194z" fill="#5c8add" ></path></symbol><symbol id="icon-liaotian" viewBox="0 0 1171 1024"><path d="M1068.71699 0.243751H102.193768C46.228437 0.243751 0.500666 45.045267 0.500666 99.74309v696.251622c0 54.697824 45.727771 99.450589 101.693102 99.450589h329.113198l120.851966 114.465677a48.652788 48.652788 0 0 0 66.641644 0l120.851966-114.465677h329.064448c55.965331 0 101.741852-44.752765 101.741852-99.450589V99.74309C1170.458842 45.045267 1124.682321 0.243751 1068.71699 0.243751z m-439.776354 596.849784h-370.989696c-27.933915 0-50.846551-22.425133-50.846551-49.774045 0-27.348912 22.912636-49.725294 50.846551-49.725294h370.989696c27.933915 0 50.846551 22.376382 50.846551 49.725294 0 27.348912-22.912636 49.774045-50.846551 49.774045z m287.18795-211.381252H254.782171a50.456549 50.456549 0 0 1-50.846551-49.725294c0-27.397662 22.912636-49.774045 50.846551-49.774045h661.346415c27.933915 0 50.846551 22.376382 50.846551 49.774045 0 27.348912-22.912636 49.725294-50.846551 49.725294z" fill="#5C8ADD" ></path></symbol><symbol id="icon-xinfeng" viewBox="0 0 1400 1024"><path d="M1301.63733163 214.78520234a207.81921797 207.81921797 0 0 1 7.02423018 52.42036465v489.73590176a205.10753818 205.10753818 0 0 1-205.05853125 205.05853125H283.05853124A205.15654424 205.15654424 0 0 1 77.99999999 756.79444971V267.20556699a201.36672685 201.36672685 0 0 1 7.02423106-52.42036465L586.24393329 562.1905874c69.44187217 51.96297217 146.36536612 49.13694404 214.1736961 0zM1103.60303056 62.0000167H283.05853124A204.50312753 204.50312753 0 0 0 106.37462518 163.41030547l489.71956641 335.75823018c62.43397646 50.77048623 127.85733457 50.31309463 194.62019765 0L1280.28693749 163.41030547A204.68281729 204.68281729 0 0 0 1103.60303056 62.0000167z m0 0" fill="#5c8add" ></path></symbol><symbol id="icon-QQ1" viewBox="0 0 1024 1024"><path d="M0 512a512 512 0 1 0 1024 0A512 512 0 1 0 0 512z" fill="#18ACFC" ></path><path d="M500.113 228.39c118.396-1.518 178.924 61.004 201 156 3.497 15.048 0.15 34.807 0 50 27.143 5.682 33.087 60.106 10 75v1h1c8.26 14.33 19.04 28.125 26 44 7.332 16.723 9.306 35.16 14 55 4.024 17.01-2.287 51.505-10 57-0.771 0.683-2.231 1.312-3 2-14.601-3.016-30.377-16.865-38-27-3.065-4.074-5.275-9.672-10-12-0.395 21.568-12.503 41.15-22 55-3.514 5.123-14.073 13.217-14 18 3.691 2.836 8.305 2.956 13 5 10.513 4.577 25.449 13.168 32 22 2.334 3.146 5.548 7.555 7 11 16.193 38.414-36.527 48.314-63 54-27.185 5.839-77.818-10.224-92-19-8.749-5.414-16.863-18.573-29-19-3.666 2.389-14.438 1.132-20 1-16.829 32.804-101.913 47.868-148 31-14.061-5.146-43.398-17.695-38-40 4.437-18.327 19.947-29.224 35-37 5.759-2.975 18.915-4.419 22-10-13.141-8.988-24.521-28.659-31-44-3.412-8.077-4.193-25.775-9-32-7.789 12.245-32.097 36.91-52 33-3.071-4.553-7.213-9.097-9-15-4.792-15.835-1.81-40.379 2-54 8.117-29.02 16.965-50.623 32-72 4.672-6.643 11.425-12.135 16-19-8.945-9.733-6.951-37.536-1-49 4.002-7.709 9.701-7.413 10-20-1.92-3.022-0.071-8.604-1-13-4.383-20.75 3.273-47.552 9-63 19.8-53.421 53.712-90.466 105-112 11.986-5.033 25.833-7.783 39-11 5.322-1.3 11.969 0.518 16-2z" fill="#FFFFFF" ></path></symbol><symbol id="icon-rss" viewBox="0 0 1024 1024"><path d="M749.61196492 908.06119793C749.61196492 560.41848146 463.58151854 274.36328126 115.93880207 274.36328126V115.93880207c434.50388795 0 792.12239584 357.61850789 792.12239586 792.12239586zM224.55858562 690.72261555a108.91682943 108.91682943 0 0 1 108.69404499 108.74355267C333.25263061 859.29616292 284.24005737 908.06119793 224.31104736 908.06119793 164.48105265 908.06119793 115.96355592 859.41993206 115.96355592 799.46616822s48.69077351-108.71879883 108.61978351-108.74355267zM641.01693522 908.06119793h-153.96879069c0-203.60020956-167.50913289-371.13409627-371.10934246-371.13409629v-153.96879068c288.03550619 0 525.07813313 237.11688843 525.07813315 525.10288697z" fill="#FFA500" ></path></symbol><symbol id="icon-youxiang" viewBox="0 0 1024 1024"><path d="M583.60666667 972h-68.08c-8.43333333 0-15.33333333-6.9-15.33333334-15.33333333V609.52c0-8.43333333 6.9-15.33333333 15.33333334-15.33333333h68.08c8.43333333 0 15.33333333 6.9 15.33333333 15.33333333V956.66666667c0 8.43333333-6.9 15.33333333-15.33333333 15.33333333z" fill="#629FF9" ></path><path d="M294.42 167c-113.62 0-205.77333333 92-205.77333333 205.31333333v336.72h411.39333333V372.31333333c0.15333333-113.31333333-92-205.31333333-205.62-205.31333333z" fill="#2166CC" ></path><path d="M519.97333333 627H216.98666667c-25.45333333 0-46-20.54666667-46-46V393.78c0-25.45333333 20.54666667-46 46-46h302.98666666c25.45333333 0 46 20.54666667 46 46V581c0 25.45333333-20.54666667 46-46 46z" fill="#D2E4FF" ></path><path d="M565.97333333 397a49.22 49.22 0 0 0-49.37333333-49.22H220.36c-27.29333333 0-49.37333333 22.08-49.37333333 49.22v10.27333333l179.4 94.60666667c11.34666667 5.98 24.84 5.98 36.18666666 0l179.4-94.60666667v-10.27333333z" fill="#FFFFFF" ></path><path d="M730.5 167h-427.8v0.46c109.78666667 4.29333333 197.49333333 94.3 197.49333333 205.00666667v336.72h411.39333334c27.29333333 0 49.37333333-22.08 49.37333333-49.22V397c0-126.96-103.19333333-230-230.46-230z" fill="#4E8DF6" ></path><path d="M845.80666667 52H681.12666667c-9.04666667 0-16.40666667 7.36-16.40666667 16.40666667v336.72a24.67133333 24.67133333 0 1 0 49.37333333 0V134.18666667h131.71333334c9.04666667 0 16.40666667-7.36 16.40666666-16.40666667V68.40666667c0-9.04666667-7.36-16.40666667-16.40666666-16.40666667z" fill="#2166CC" ></path><path d="M896.25333333 659.81333333h-35.11333333c-8.43333333 0-15.33333333-6.9-15.33333333-15.33333333v-35.11333333c0-8.43333333 6.9-15.33333333 15.33333333-15.33333334h35.11333333c8.43333333 0 15.33333333 6.9 15.33333334 15.33333334v35.11333333c0 8.58666667-6.9 15.33333333-15.33333334 15.33333333z" fill="#FFFFFF" ></path><path d="M88.8 709.18666667l-24.22666667 131.40666666c-9.66 54.43333333 26.83333333 98.59333333 81.26666667 98.59333334h213.9c54.58666667 0 106.56666667-44.16 116.22666667-98.59333334l23.15333333-131.40666666H88.8z" fill="#2974CE" ></path></symbol><symbol id="icon-gitHub" viewBox="0 0 1049 1024"><path d="M523.6581816 52C262.83923907 52 52 262.8401375 52 523.6581816c0 208.49703047 135.09433812 384.97758117 322.50789391 447.44906532 23.42658172 4.68531653 32.01647887-10.15136894 32.01647796-22.64584583 0-10.93210574-0.78163433-48.41463703-0.78163433-87.45953855-131.18885996 28.11189824-158.5200223-56.22379738-158.52002231-56.22379739-21.08437312-54.66232469-52.3201152-68.71827336-52.3201152-68.71827335-42.94858371-28.89353348 3.12384382-28.89353348 3.12384384-28.89353348 47.63479867 3.12384382 72.62285398 48.41643391 72.62285398 48.4164339 42.16784782 71.84121875 110.10538527 51.53758242 137.43654672 39.04400399 3.90457972-30.45500618 16.3990566-51.5393793 29.67427028-63.25222094-104.64023039-10.93300418-214.74561566-51.53848086-214.74561657-232.70524742 0-51.53848086 18.74126609-93.70632867 48.4164339-126.50444187-4.68621496-11.71284164-21.08527156-60.12837711 4.6844181-124.94207075 0 0 39.82563922-12.49447688 129.62738726 48.41463704 37.48253129-10.15136894 78.08980484-15.61742227 117.91454562-15.61742137s80.43201433 5.46605242 117.91454473 15.61742137c89.80264648-60.90911391 129.62828571-48.41463703 129.62828571-48.41463704 25.76879122 64.81369363 9.37063305 113.22922911 4.68531651 124.94207075 30.45410773 32.79721477 48.41463703 74.96506258 48.41463703 126.50444187 0 181.16676656-110.10538527 220.99150644-215.52545401 232.70524742 17.1797934 14.83668547 32.01647887 42.94858371 32.01647886 87.45953946 0 63.25222094-0.78163433 114.009965-0.78163523 129.62738636 0 12.49447688 8.59079468 27.33116234 32.01737731 22.64584583 187.41265734-62.4705866 322.50699547-238.95203574 322.50699546-447.44996375C995.31636231 262.8401375 783.69369203 52 523.6581816 52z" fill="#663399" ></path><path d="M230.82365863 729.03136735c-0.7807359 2.34310703-4.68531653 3.12384382-7.80916035 1.56237113s-5.46605242-4.68531653-3.90368129-7.02842356c0.7807359-2.34220859 4.68531653-3.12384382 7.80826192-1.56147269s4.68531653 4.68531653 3.90457972 7.02752512z m18.7412661 21.08437312c-2.34220859 2.34220859-7.02752512 0.78163433-9.37063305-2.34310703-3.12294539-3.12294539-3.90457972-7.80826192-1.5614727-10.15136894 2.34220859-2.34220859 6.24678922-0.7807359 9.37063305 2.34310702 3.12384382 3.90457972 3.90457972 8.58899782 1.5614727 10.15136895zM268.30618992 777.44690281c-3.12294539 2.34220859-7.80826192 0-10.15136895-3.90457972-3.12384382-3.90457972-3.12384382-9.37063305 0-10.93210574 3.12384382-2.34310703 7.80916035 0 10.15226739 3.90457972 3.12294539 3.90368129 3.12294539 8.58899782 0 10.93210574z m25.76968965 26.55042555c-2.34220859 3.12294539-7.80916035 2.34220859-12.49447688-1.56237113-3.90457972-3.90368129-5.46605242-9.37063305-2.34220859-11.71284164 2.34220859-3.12384382 7.80826192-2.34310703 12.49447687 1.56147269 3.90368129 3.12384382 4.68531653 8.58989625 2.3422086 11.71374008z m35.1403227 14.83668637c-0.78163433 3.90457972-6.24768766 5.46605242-11.71374008 3.90457972-5.46605242-1.5614727-8.58899782-6.24768766-7.80916036-9.37063305 0.78163433-3.90457972 6.24768766-5.46605242 11.71374009-3.90457972 5.46605242 1.5614727 8.58899782 5.46605242 7.80916035 9.37063305z m38.26416562 3.12384382c0 3.90457972-4.68621496 7.02752512-10.15226738 7.02752512-5.46605242 0-10.15226738-3.12294539-10.15226739-7.02752512s4.68621496-7.02842356 10.15226739-7.02842445c5.46605242 0 10.15226738 3.12384382 10.15226738 7.02842445z m35.92016106-6.24768766c0.78163433 3.90457972-3.12384382 7.80916035-8.58899872 8.58989625-5.46695086 0.78163433-10.15226738-1.5614727-10.93390172-5.46605241-0.77983747-3.90457972 3.12384382-7.80916035 8.5907947-8.58899872 5.46605242-0.78163433 10.15136894 1.56057426 10.93210574 5.46515488z m0 0" fill="#663399" ></path></symbol><symbol id="icon-bilibili" viewBox="0 0 1024 1024"><path d="M832.61667555 181.33447111h-164.32545185l74.45617778-74.45617778c12.84020148-12.84020148 12.84020148-30.8140563 0-43.65425778-12.84020148-12.84020148-30.8140563-12.84020148-43.65425778 0L573.2882963 189.04101925H450.04420741L324.2272237 63.23617185c-10.26730667-12.84020148-25.68040297-15.40096-41.08136295-7.70654815-2.57289482 0-2.57289482 2.57289482-5.13365334 5.13365333-12.84020148 12.84020148-12.84020148 30.8140563 0 43.65425779l77.02907259 77.02907259h-164.32545185c-89.86927408 0-164.32545185 74.45617778-164.32545185 164.32545184v408.24073483c0 87.29637925 74.45617778 161.75255703 164.32545185 161.75255703h25.68040296c0 30.8140563 25.68040297 53.92156445 53.92156444 53.92156444s53.92156445-25.68040297 53.92156445-53.92156444H704.23893333c2.57289482 30.8140563 28.24116148 53.92156445 59.05521778 51.34866964 28.24116148-2.57289482 48.78791111-23.10750815 51.34866964-51.34866964h20.53461333c89.86927408 0 164.32545185-74.45617778 164.32545184-164.32545186V343.09916445c-2.56075852-89.86927408-77.02907259-161.76469333-166.88621037-161.76469334z m-5.13365333 634.19429926H200.99527111c-33.37481482 0-59.05521778-28.24116148-61.61597629-61.61597629l-2.57289482-415.94728297c0-33.37481482 28.24116148-61.6159763 61.6159763-61.61597629h626.48775111c33.37481482 0 59.05521778 28.24116148 61.61597629 61.61597629l2.57289482 415.94728297c-2.57289482 35.93557333-28.24116148 61.6159763-61.6159763 61.61597629z" fill="#ff7299" ></path><path d="M403.82919111 417.55534222l15.40096 77.0290726-205.40681481 38.50846815-15.40096-77.0290726 205.40681481-38.50846815z m197.70026667 77.0290726l15.40096-77.0290726 205.40681481 38.50846815-15.40096 77.0290726-205.40681481-38.50846815z m41.08136297 161.75255703c0 2.57289482 0 7.70654815-2.57289483 10.26730667-12.84020148 28.24116148-41.08136297 46.2150163-74.45617777 48.78791111-20.53461333 0-41.08136297-10.26730667-53.92156445-25.68040296-15.40096 15.40096-33.37481482 25.68040297-53.92156445 25.68040296-30.8140563-2.57289482-59.05521778-20.53461333-74.45617777-48.78791111 0-2.57289482-2.57289482-5.13365333-2.57289481-10.26730667 0-10.26730667 7.70654815-17.97385482 17.97385481-20.53461333h2.57289482c7.70654815 0 12.84020148 2.57289482 15.40096 10.26730666 0 0 20.53461333 28.24116148 38.50846815 28.24116149 35.94770963 0 35.94770963-30.8140563 56.48232296-53.92156445 23.10750815 25.68040297 23.10750815 53.92156445 56.48232296 53.92156445 23.10750815 0 38.50846815-28.24116148 38.50846815-28.24116149 2.57289482-5.13365333 10.26730667-10.26730667 15.40096-10.26730666 10.26730667-2.57289482 17.97385482 5.13365333 20.53461333 15.40096v5.13365333h0.0364089z" fill="#ff7299" ></path></symbol></svg>', o = (o = document.getElementsByTagName("script"))[o.length - 1].getAttribute("data-injectcss"), p = function (c, l) { l.parentNode.insertBefore(c, l); }; if (o && !c.__iconfont__svg__cssinject__) { c.__iconfont__svg__cssinject__ = !0; try { document.write( "<style>.svgfont {display: inline-block;width: 1em;height: 1em;fill: currentColor;vertical-align: -0.1em;font-size:16px;}</style>" ); } catch (c) { console && console.log(c); } } function d() { i || ((i = !0), a()); } function m() { try { t.documentElement.doScroll("left"); } catch (c) { return void setTimeout(m, 50); } d(); } (l = function () { var c, l = document.createElement("div"); (l.innerHTML = v), (v = null), (l = l.getElementsByTagName("svg")[0]) && (l.setAttribute("aria-hidden", "true"), (l.style.position = "absolute"), (l.style.width = 0), (l.style.height = 0), (l.style.overflow = "hidden"), (l = l), (c = document.body).firstChild ? p(l, c.firstChild) : c.appendChild(l)); }), document.addEventListener ? ~["complete", "loaded", "interactive"].indexOf(document.readyState) ? setTimeout(l, 0) : ((h = function () { document.removeEventListener("DOMContentLoaded", h, !1), l(); }), document.addEventListener("DOMContentLoaded", h, !1)) : document.attachEvent && ((a = l), (t = c.document), (i = !1), m(), (t.onreadystatechange = function () { "complete" == t.readyState && ((t.onreadystatechange = null), d()); })); })(window);]]></content>
</entry>
<entry>
<title></title>
<link href="/js/runtime/runtime-min.js"/>
<url>/js/runtime/runtime-min.js</url>
<content type="html"><![CDATA[var now=new Date;function createtime(){var e=new Date("04/01/2023 00:00:00");now.setTime(now.getTime()+250);var t=(now-e)/1e3/60/60/24,a=Math.floor(t),n=(now-e)/1e3/60/60-24*a,r=Math.floor(n);1==String(r).length&&(r="0"+r);var s=(now-e)/1e3/60-1440*a-60*r,i=Math.floor(s);1==String(i).length&&(i="0"+i);var o=(now-e)/1e3-86400*a-3600*r-60*i,l=Math.round(o);1==String(l).length&&(l="0"+l);let g="";g=r<18&&r>=9?`<img class='boardsign' src='/img/兔老大-上班摸鱼中.svg' title='距离月入25k也就还差一个大佬带我~'><span class='textTip'> <br> 本站居然运行了 ${a} 天</span><span id='runtime'> ${r} 小时 ${i} 分 ${l} 秒 </span> <i class='fas fa-heartbeat' style='color:red'></i>`:`<img class='boardsign' src='/img/兔老大-下班啦.svg' title='下班了就该开开心心的玩耍,嘿嘿~'><span class='textTip'> <br> 本站居然运行了 ${a} 天</span><span id='runtime'> ${r} 小时 ${i} 分 ${l} 秒 </span> <i class='fas fa-heartbeat' style='color:red'></i>`,document.getElementById("workboard")&&(document.getElementById("workboard").innerHTML=g)}setInterval((()=>{createtime()}),250);]]></content>
</entry>
<entry>
<title></title>
<link href="/js/runtime/runtime.js"/>
<url>/js/runtime/runtime.js</url>
<content type="html"><![CDATA[var now = new Date();function createtime() { var grt = new Date("04/01/2023 00:00:00"); now.setTime(now.getTime() + 250); var days = (now - grt) / 1e3 / 60 / 60 / 24, dnum = Math.floor(days), hours = (now - grt) / 1e3 / 60 / 60 - 24 * dnum, hnum = Math.floor(hours); 1 == String(hnum).length && (hnum = "0" + hnum); var minutes = (now - grt) / 1e3 / 60 - 1440 * dnum - 60 * hnum, mnum = Math.floor(minutes); 1 == String(mnum).length && (mnum = "0" + mnum); var seconds = (now - grt) / 1e3 - 86400 * dnum - 3600 * hnum - 60 * mnum, snum = Math.round(seconds); 1 == String(snum).length && (snum = "0" + snum); let currentTimeHtml = ""; (currentTimeHtml = hnum < 18 && hnum >= 9 ? `<img class='boardsign' src='/img/兔老大-上班摸鱼中.svg' title='距离月入25k也就还差一个大佬带我~'><span class='textTip'> <br> 本站居然运行了 ${dnum} 天</span><span id='runtime'> ${hnum} 小时 ${mnum} 分 ${snum} 秒 </span> <i class='fas fa-heartbeat' style='color:red'></i>` : `<img class='boardsign' src='/img/兔老大-下班啦.svg' title='下班了就该开开心心的玩耍,嘿嘿~'><span class='textTip'> <br> 本站居然运行了 ${dnum} 天</span><span id='runtime'> ${hnum} 小时 ${mnum} 分 ${snum} 秒 </span> <i class='fas fa-heartbeat' style='color:red'></i>`), document.getElementById("workboard") && (document.getElementById("workboard").innerHTML = currentTimeHtml);}setInterval(() => { createtime();}, 250);]]></content>
</entry>
</search>