sinzmise-cetastories 1.9.0-1727922211770 → 2.0.0-1728224519839

package/search.xml

@@ -0,0 +1,1323 @@
+<?xml version="1.0" encoding="utf-8"?>
+<search>
+  <entry>
+    <title>2023小结</title>
+    <url>/posts/27531/</url>
+    <content><![CDATA[<p><del>不要在意封面为什么做得这么简陋。。。。。</del></p>
+<p>时间过得真快，转眼间，就得跟2023告别了<br>不知道要写什么，就简单写个小结吧</p>
+<h1 id="部署的项目"><a href="#部署的项目" class="headerlink" title="部署的项目"></a>部署的项目</h1><p><a href="http://rtalk.rita2.myfw.us/">Rita2 Talk</a> —— 为旧设备服务的自建微博<br><a href="https://www.sinzmise.top">中弦局花园</a> —— 模仿秘密花园的一个站点<br><a href="https://diary.sinzmise.top/">九弦记事本（原九弦日记）</a> —— 一个普通的记事本(目前已经迁移到koyeb)<br><div class="flink"><div class="flink-name">结识的朋友</div> <div class="flink-list">
+          <div class="flink-list-item">
+            <a href="https://jixingwu.myfw.us/" title="疾行侠（千寻）" target="_blank">
+              <div class="flink-item-icon">
+                <img class="no-lightbox" src="https://weavatar.com/avatar/7e0c1e30717959813390670e5a97b8d6?s=1000" onerror='this.onerror=null;this.src="/img/friend_404.gif"' alt="疾行侠（千寻）"   data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'/>
+              </div>
+              <div class="flink-item-name">疾行侠（千寻）</div> 
+              <div class="flink-item-desc" title="疾不一定是快，但它会让我们更坚强">疾不一定是快，但它会让我们更坚强</div>
+            </a>
+          </div>
+          <div class="flink-list-item">
+            <a href="https://ayu.land/" title="甜鱼/Ayu" target="_blank">
+              <div class="flink-item-icon">
+                <img class="no-lightbox" src="https://ayu.land/about/Ayu.jpg" onerror='this.onerror=null;this.src="/img/friend_404.gif"' alt="甜鱼/Ayu"   data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'/>
+              </div>
+              <div class="flink-item-name">甜鱼/Ayu</div> 
+              <div class="flink-item-desc" title="三脚猫多面手，努力学习世界的一切。">三脚猫多面手，努力学习世界的一切。</div>
+            </a>
+          </div>
+          <div class="flink-list-item">
+            <a href="https://www.whaleluo.top/" title="Whale Fall 鲸落(ღ˘⌣˘ღ)" target="_blank">
+              <div class="flink-item-icon">
+                <img class="no-lightbox" src="https://q1.qlogo.cn/g?b=qq&nk=2734184475&s=640" onerror='this.onerror=null;this.src="/img/friend_404.gif"' alt="Whale Fall 鲸落(ღ˘⌣˘ღ)"   data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'/>
+              </div>
+              <div class="flink-item-name">Whale Fall 鲸落(ღ˘⌣˘ღ)</div> 
+              <div class="flink-item-desc" title="海的那边还是海吗？">海的那边还是海吗？</div>
+            </a>
+          </div></div></div><br>更多朋友前往：<a href="/link/">友情链接</a></p>
+<h1 id="玩过的游戏（加粗为常玩）"><a href="#玩过的游戏（加粗为常玩）" class="headerlink" title="玩过的游戏（加粗为常玩）"></a>玩过的游戏（加粗为常玩）</h1><p><strong>赛马娘（台服）</strong><br><strong>蔚蓝档案（台服）</strong><br>重返未来1999 （暂退）<br>Minecraft <psw>（放心不是冈易那个MC）</psw><br>Roblox<br>光·遇（安小歪推荐的）<br>Phigros<br>Sonolus<br>节奏大师回归版<br>BanG Dream<br>荒野乱斗（现实朋友推荐的）<br>暗区突围（千寻推荐的）</p>
+<h1 id="后记"><a href="#后记" class="headerlink" title="后记"></a>后记</h1><p>2023年即将到来，我也将我友链页面的“博客描述”改成：欢迎旅行者，来到这个平凡但又记载了许多故事的小屋<br>并且将中弦局图标更新：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/SinZero%E6%96%B0%E5%9B%BE%E6%A0%87.png" alt="中弦局新图标"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><psw>（虽然有点缺陷，但后面会优化）</psw></p>
+<p>最后你有没有想对2023说的话？请写在评论区吧<br>再见，2023<br>你好，2024</p>
+]]></content>
+      <categories>
+        <category>个人小记</category>
+      </categories>
+      <tags>
+        <tag>个人小记</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>2024.01小记</title>
+    <url>/posts/52677/</url>
+    <content><![CDATA[<p>2024年1月31日，距离春节还剩10天<br>也是1月的最后一天<br>时间过得真快呢，转眼间就快要过年了<br>就以这篇文章，作为1月的收尾吧</p>
+<h1 id="个人主页翻修"><a href="#个人主页翻修" class="headerlink" title="个人主页翻修"></a>个人主页翻修</h1><p>我承认我之前将个人主页更换成i.sinzmise.top，然后把www.sinzmise.top搞成九弦之都官网是个很愚蠢的事情<br>因为踏入高一后，学习任务愈加繁重，导致了每次更新博客就得放弃那边，更新那边又得放弃博客，我一个人做不了这么多的事情<br>思来想去，我最终将www.sinzmise.top改成自己的个人主页，然后将之前的i.sinzmise.top记录删掉</p>
+<p>新版的个人主页是从我之前在网上找到的“Bs缘空个人主页”魔改而来的，修改了如下内容：</p>
+<ul>
+<li>删掉“我的”寄”能”</li>
+<li>将原本的“关于我”内容最下方的“Certificates”改成51la统计</li>
+<li>将原本的“Portfolio”改成“个人项目”，里面的东西改成自己搞的项目</li>
+<li>将原本的“Blog”改成“站长记事”，里面的内容我换成了木木大佬的<a href="https://immmmm.com/bb-by-memos/">哔哔点啥2.0</a></li>
+<li>将原本的“Contact”标题改成“给我留言”，里面的内容则被我换成了Disqus评论系统和Twikoo评论系统（其中Disqus的评论基础模式用的是fooleap大佬的<a href="https://github.com/fooleap/disqus-php-api">disqus-php-api</a>）</li>
+<li>添加Aplayer音乐播放器</li>
+</ul>
+<p>展示图：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240131/www.sinzmise.top.6nqhgv7ubg40.webp" alt="www"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p>预览：<a href="https://www.sinzmise.top/">中弦局·九弦之都</a></p>
+<h1 id="入坑pjsk"><a href="#入坑pjsk" class="headerlink" title="入坑pjsk"></a>入坑pjsk</h1><p>这个没啥好说的，毕竟我有入坑过邦（BanG Dream！少女乐团派对）、Phigros或者Arcaea等音游<br><psw>（虽然我没咋玩音游。。。。。。）</psw><br>至于为啥我玩完pjsk自制谱Sonolus之后要玩官方版本pjsk。。。。。。<br>主要是我朋友也在玩pjsk官方版（虽然他经常玩Arcaea），思来想去还是觉得下个官方版本pjsk</p>
+<h1 id="自建API"><a href="#自建API" class="headerlink" title="自建API"></a>自建API</h1><p>其实这API原本是想给我的个人主页使用的。。。。。。但搭建完个人主页才知道我是个大聪明，直接使用哪个壁纸不行吗。。。。。。<br>算了，搭都搭建了，就别浪费，直接展示吧：<a href="https://api.sininno.eu.org/">https://api.sininno.eu.org/</a><br>（顺便归纳到我之前打算新建的计划里面，这样也算杜绝浪费了。。。。。。吧？）</p>
+]]></content>
+      <categories>
+        <category>个人小记</category>
+      </categories>
+      <tags>
+        <tag>个人小记</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>2024-02小记</title>
+    <url>/posts/15842/</url>
+    <content><![CDATA[<div class="tip success"><p>本文章已经同步到xLog：<a href="https://xlog.sinzmise.top/write-2024-02">https://xlog.sinzmise.top/write-2024-02</a> </p>
+</div>
+<p>时间真快，转眼间，新年、2月过去了<br>就让这里写下我2月做了什么吧</p>
+<h1 id="伺か（伪春菜），我并未忘记"><a href="#伺か（伪春菜），我并未忘记" class="headerlink" title="伺か（伪春菜），我并未忘记"></a>伺か（伪春菜），我并未忘记</h1><p>从之前我就想将明猪大佬的网页版伪春菜看板娘搞到Hexo里去，因为时间等原因我并未实施<br>现在我把它搞上去了，效果如下：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/msedge_KiupgoTMYf.101wojo3eg.webp" alt="msedge_KiupgoTMYf"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>目前所使用的人格是落鸟，后面如果有时间的话我写个Hexo插件，然后在插件里切换人格<br>还有有关聊天功能嘛。。。。。我是打算用AI来实现啦。。。。。。。</p>
+<p>（2024-05 因为新博客部署伪春菜的时候出现了一些问题，导致春菜没到新家，很抱歉！目前正在修复）</p>
+<p>现在因为开学了，所以不能经常打开ssp看橘花和绿坝娘（没错，也有人做绿坝娘的ssp人格，甚至还是有配音的）<br>但是我依然没有忘掉他们。。。。。。<br>就像我之前的文章里说的，希望伪春菜这个圈子能跟以前一样在国内重新爆发活力<br>（虽然代价是圈子变臭，还不如让很少人了解这个圈子。。。。。）</p>
+<h1 id="Memos又寄了。。。。。。"><a href="#Memos又寄了。。。。。。" class="headerlink" title="Memos又寄了。。。。。。"></a>Memos又寄了。。。。。。</h1><p>我是没想到Koyeb会暂停部署，Kuma来了也没管用<br>算了，后面我找个免费方法再搞Memos吧<br>反正现在还能访问，{ psw 这个干脆就做简短点啦。。。。。（bushi） }</p>
+<h1 id="GTA-V，启动！"><a href="#GTA-V，启动！" class="headerlink" title="GTA V，启动！"></a>GTA V，启动！</h1><p>别问为啥要把这个放在二月小记，我只能在周末才能碰到电脑，也因此只能在假期写文章<br>{ psw 也别问我为啥不在手机上写，我Qexo都没搞。。。。。。 }<br>经过小何的邀请下，我决定入坑GTA5，并且在小何的帮助下成功用15块钱搞到了GTA5白号<br>他带我打了个差事，然后抢抢便利店，最后还打了死亡对战（虽然平局了）<br>怎么说呢。。。。。。。虽然我玩的游戏很多，但因为我很少玩游戏，所以不知道怎么评价<br>但怎么说呢，总归也入坑了一款我没玩过的游戏呢</p>
+]]></content>
+      <categories>
+        <category>个人小记</category>
+      </categories>
+      <tags>
+        <tag>个人小记</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>2024-04小记</title>
+    <url>/posts/15748/</url>
+    <content><![CDATA[<div class="tip success"><p>本文章已经同步到xLog：<a href="https://xlog.sinzmise.top/write-2024-04">https://xlog.sinzmise.top/write-2024-04</a> </p>
+</div>
+<p>先祝大家劳动节快乐（虽然已经过了一天），也提前祝大家五四青年节快乐！<br>然后，正片开始！</p>
+<h1 id="Akilar群寄了"><a href="#Akilar群寄了" class="headerlink" title="Akilar群寄了"></a>Akilar群寄了</h1><p>这件事还是小何告诉我的<psw>（小何没告诉我之前我还不知道）</psw><br>看店长的文章我才知道大概是有群友转发了含R18内容的聊天记录，然后Akliar才把群给解散的<br>Akilar的通知：<br><div class="tag link"><a class="link_card" referrerPolicy="no-referrer" title="关于群聊更换的紧急通知" href="https://akilar.top/posts/c215d440/"><div class="link_icon"><img src="https://npm.elemecdn.com/akiblog@1.0.2/img/siteicon/favicon.png" class="no-lightbox"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></div><div class="link_content"><div class="link_title">关于群聊更换的紧急通知</div><div class="link_desc">真不知道哪个人这么无聊，好好的群都给人整废</div></div></a></div><br>Akilar新群：<br><div class="tag link"><a class="link_card" referrerPolicy="no-referrer" title="Akilarの糖果屋-新群" href="http://qm.qq.com/cgi-bin/qm/qr?_wv=1027&k=foNxpbHAuNFbc_cGIcPS_Qjc2Zk1uy-u&authKey=%2FO6mPpYjRlwIjqfWE7AnMfJpYW9zfDAkaHRACm1Wn9Mg7cjkyAcbkGTwpsqMIno9&noverify=0&group_code=725597418"><div class="link_icon"><img src="https://npm.elemecdn.com/akiblog@1.0.2/img/siteicon/favicon.png" class="no-lightbox"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></div><div class="link_content"><div class="link_title">Akilarの糖果屋-新群</div><div class="link_desc">洪槽纪年结束，现在是洪mac纪年</div></div></a></div><br>然后洪mac一年一月八日<del>（bushi）</del>（也就是2024年五月三日），我加入了Akilar的新群</p>
+<h1 id="加入笔墨迹"><a href="#加入笔墨迹" class="headerlink" title="加入笔墨迹"></a>加入笔墨迹</h1><p>Blogs·CN（笔墨迹）是一个位于中国境内的平台，致力于发掘和分享”优秀个人独立博客”。</p>
+<p>我老早之前就想加入了，但是那天由于博客要重新装修，所以我没加入<br>现在装修好了，可以加入了<br>目前已经通过</p>
+<h1 id="博客更新"><a href="#博客更新" class="headerlink" title="博客更新"></a>博客更新</h1><p>请看这个：<br><div class="tag link"><a class="link_card" referrerPolicy="no-referrer" title="更新记录" href="/update/"><div class="link_icon"><svg t="1670307855063" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="19066" width="200" height="200"><path d="M504.064 516.608m-384.256 0a384.256 384.256 0 1 0 768.512 0 384.256 384.256 0 1 0-768.512 0Z" fill="#009CF5" p-id="19068"></path><path d="M746.112 270.464L472.448 485.12l63.104 63.104L750.08 274.56c2.304-2.688-1.28-6.144-3.968-4.096z" fill="#FF4C3A" p-id="19069"></path><path d="M262.016 762.752l273.664-214.528-63.104-63.104-214.656 273.536c-2.176 2.688 1.28 6.144 4.096 4.096z" fill="#FFFFFF" p-id="19070"></path><path d="M505.216 155.136c-3.2 0-5.888 2.56-5.888 5.888v53.504c0 3.2 2.56 5.888 5.888 5.888s5.888-2.56 5.888-5.888v-53.504c-0.128-3.2-2.688-5.888-5.888-5.888zM442.368 160.512c-3.2 0.512-5.376 3.584-4.736 6.784l9.344 52.736c0.512 3.2 3.584 5.376 6.784 4.736 3.2-0.512 5.376-3.584 4.736-6.784l-9.344-52.736c-0.512-3.2-3.584-5.376-6.784-4.736zM396.288 234.368c1.152 3.072 4.48 4.608 7.552 3.456 3.072-1.152 4.608-4.48 3.456-7.552l-18.304-50.304c-1.152-3.072-4.48-4.608-7.552-3.456-3.072 1.152-4.608 4.48-3.456 7.552l18.304 50.304zM348.928 257.408c1.664 2.816 5.248 3.712 7.936 2.176s3.712-5.248 2.176-7.936l-26.752-46.336c-1.664-2.816-5.248-3.712-7.936-2.176-2.816 1.664-3.712 5.248-2.176 7.936l26.752 46.336zM306.304 288.256c2.048 2.432 5.76 2.816 8.192 0.768 2.432-2.048 2.816-5.76 0.768-8.192l-34.432-40.96c-2.048-2.432-5.76-2.816-8.192-0.768-2.432 2.048-2.816 5.76-0.768 8.192l34.432 40.96zM269.696 326.144c2.432 2.048 6.144 1.792 8.192-0.768 2.048-2.432 1.792-6.144-0.768-8.192l-40.96-34.432c-2.432-2.048-6.144-1.792-8.192 0.768-2.048 2.432-1.792 6.144 0.768 8.192l40.96 34.432zM193.792 342.912l46.336 26.752c2.816 1.664 6.4 0.64 7.936-2.176 1.664-2.816 0.64-6.4-2.176-8.064L199.552 332.8c-2.816-1.664-6.4-0.64-7.936 2.176-1.664 2.688-0.64 6.272 2.176 7.936zM168.32 399.488l50.304 18.304c3.072 1.152 6.4-0.512 7.552-3.456 1.152-3.072-0.512-6.4-3.456-7.552l-50.304-18.304c-3.072-1.152-6.4 0.512-7.552 3.456-1.152 3.072 0.384 6.4 3.456 7.552zM207.872 457.344l-52.736-9.344c-3.2-0.512-6.272 1.536-6.784 4.736-0.512 3.2 1.536 6.272 4.736 6.784l52.736 9.344c3.2 0.512 6.272-1.536 6.784-4.736 0.512-3.2-1.536-6.272-4.736-6.784zM201.984 509.568H148.48c-3.2 0-5.888 2.56-5.888 5.888 0 3.2 2.56 5.888 5.888 5.888h53.504c3.2 0 5.888-2.56 5.888-5.888 0-3.2-2.56-5.888-5.888-5.888zM205.44 562.176l-52.736 9.344c-3.2 0.512-5.376 3.584-4.736 6.784 0.512 3.2 3.584 5.376 6.784 4.736l52.736-9.344c3.2-0.512 5.376-3.584 4.736-6.784s-3.584-5.248-6.784-4.736zM217.856 613.376l-50.304 18.304c-3.072 1.152-4.608 4.48-3.456 7.552 1.152 3.072 4.48 4.608 7.552 3.456l50.304-18.304c3.072-1.152 4.608-4.48 3.456-7.552-1.152-3.072-4.48-4.608-7.552-3.456zM238.976 661.504l-46.336 26.752c-2.816 1.664-3.712 5.248-2.176 8.064 1.664 2.816 5.248 3.712 8.064 2.176l46.336-26.752c2.816-1.664 3.712-5.248 2.176-8.064-1.664-2.816-5.248-3.712-8.064-2.176zM268.16 705.408l-40.96 34.432c-2.432 2.048-2.816 5.76-0.768 8.192 2.048 2.432 5.76 2.816 8.192 0.768l40.96-34.432c2.432-2.048 2.816-5.76 0.768-8.192-1.92-2.56-5.632-2.816-8.192-0.768zM304.512 743.424l-34.432 40.96c-2.048 2.432-1.792 6.144 0.768 8.192 2.432 2.048 6.144 1.792 8.192-0.768l34.432-40.96c2.048-2.432 1.792-6.144-0.768-8.192-2.304-1.92-6.016-1.664-8.192 0.768zM347.008 774.656l-26.752 46.336c-1.664 2.816-0.64 6.4 2.176 7.936 2.816 1.664 6.4 0.64 8.064-2.176l26.752-46.336c1.664-2.816 0.64-6.4-2.176-7.936-2.816-1.536-6.4-0.64-8.064 2.176zM394.24 798.08l-18.304 50.304c-1.152 3.072 0.512 6.4 3.456 7.552 3.072 1.152 6.4-0.512 7.552-3.456l18.304-50.304c1.152-3.072-0.512-6.4-3.456-7.552-3.072-1.152-6.528 0.384-7.552 3.456zM440.192 872.32c3.2 0.512 6.272-1.536 6.784-4.736l9.344-52.736c0.512-3.2-1.536-6.272-4.736-6.784-3.2-0.512-6.272 1.536-6.784 4.736l-9.344 52.736c-0.64 3.2 1.536 6.272 4.736 6.784zM502.912 878.08c3.2 0 5.888-2.56 5.888-5.888v-53.504c0-3.2-2.56-5.888-5.888-5.888-3.2 0-5.888 2.56-5.888 5.888v53.504c0 3.2 2.688 5.888 5.888 5.888zM549.632 815.232l9.344 52.736c0.512 3.2 3.584 5.376 6.784 4.736 3.2-0.512 5.376-3.584 4.736-6.784l-9.344-52.736c-0.512-3.2-3.584-5.376-6.784-4.736-3.2 0.512-5.248 3.584-4.736 6.784zM600.832 802.816l18.304 50.304c1.152 3.072 4.48 4.608 7.552 3.456 3.072-1.152 4.608-4.48 3.456-7.552L611.84 798.72c-1.152-3.072-4.48-4.608-7.552-3.456-3.072 1.152-4.608 4.48-3.456 7.552zM649.088 781.696l26.752 46.336c1.664 2.816 5.248 3.712 8.064 2.176 2.816-1.664 3.712-5.248 2.176-8.064l-26.88-46.336c-1.664-2.816-5.248-3.712-8.064-2.176-2.816 1.664-3.712 5.248-2.048 8.064zM692.864 752.384l34.432 40.96c2.048 2.432 5.76 2.816 8.192 0.768 2.432-2.048 2.816-5.76 0.768-8.192l-34.432-40.96c-2.048-2.432-5.76-2.816-8.192-0.768-2.56 2.048-2.816 5.76-0.768 8.192zM730.88 716.032l40.96 34.432c2.432 2.048 6.144 1.792 8.192-0.768 2.048-2.432 1.792-6.144-0.768-8.192l-40.96-34.432c-2.432-2.048-6.144-1.792-8.192 0.768-1.92 2.432-1.664 6.144 0.768 8.192zM762.112 673.664l46.336 26.752c2.816 1.664 6.4 0.64 8.064-2.176 1.664-2.816 0.64-6.4-2.176-7.936L768 663.552c-2.816-1.664-6.4-0.64-8.064 2.176-1.536 2.688-0.64 6.272 2.176 7.936zM785.536 626.432l50.304 18.304c3.072 1.152 6.4-0.512 7.552-3.456 1.152-3.072-0.512-6.4-3.456-7.552l-50.304-18.304c-3.072-1.152-6.4 0.512-7.552 3.456-1.152 3.072 0.384 6.4 3.456 7.552zM800.256 575.872l52.736 9.344c3.2 0.512 6.272-1.536 6.784-4.736 0.512-3.2-1.536-6.272-4.736-6.784l-52.736-9.344c-3.2-0.512-6.272 1.536-6.784 4.736-0.512 3.2 1.536 6.272 4.736 6.784zM800.256 517.76c0 3.2 2.56 5.888 5.888 5.888h53.504c3.2 0 5.888-2.56 5.888-5.888 0-3.2-2.56-5.888-5.888-5.888h-53.504c-3.328 0-5.888 2.56-5.888 5.888zM802.688 471.04l52.736-9.344c3.2-0.512 5.376-3.584 4.736-6.784-0.512-3.2-3.584-5.376-6.784-4.736l-52.736 9.344c-3.2 0.512-5.376 3.584-4.736 6.784 0.512 3.2 3.584 5.248 6.784 4.736zM790.272 419.84l50.304-18.304c3.072-1.152 4.608-4.48 3.456-7.552-1.152-3.072-4.48-4.608-7.552-3.456l-50.304 18.304c-3.072 1.152-4.608 4.48-3.456 7.552 1.152 2.944 4.48 4.608 7.552 3.456zM769.152 371.584l46.336-26.752c2.816-1.664 3.712-5.248 2.176-7.936-1.664-2.816-5.248-3.712-8.064-2.176l-46.336 26.752c-2.816 1.664-3.712 5.248-2.176 8.064 1.664 2.688 5.248 3.712 8.064 2.048zM739.84 327.808l40.96-34.432c2.432-2.048 2.816-5.76 0.768-8.192-2.048-2.432-5.76-2.816-8.192-0.768l-40.96 34.432c-2.432 2.048-2.816 5.76-0.768 8.192 2.048 2.56 5.76 2.816 8.192 0.768zM703.488 289.664l34.432-40.96c2.048-2.432 1.792-6.144-0.768-8.192-2.432-2.048-6.144-1.792-8.192 0.768l-34.432 40.96c-2.048 2.432-1.792 6.144 0.768 8.192 2.432 2.048 6.144 1.792 8.192-0.768zM661.12 258.56l26.752-46.336c1.664-2.816 0.64-6.4-2.176-7.936-2.816-1.664-6.4-0.64-8.064 2.176l-26.752 46.336c-1.664 2.816-0.64 6.4 2.176 7.936 2.816 1.536 6.4 0.64 8.064-2.176zM613.888 235.136l18.304-50.304c1.152-3.072-0.512-6.4-3.456-7.552-3.072-1.152-6.4 0.512-7.552 3.456L602.88 231.168c-1.152 3.072 0.512 6.4 3.456 7.552 3.072 1.024 6.4-0.512 7.552-3.584zM556.544 225.152c3.2 0.512 6.272-1.536 6.784-4.736l9.344-52.736c0.512-3.2-1.536-6.272-4.736-6.784-3.2-0.512-6.272 1.536-6.784 4.736l-9.344 52.736c-0.512 3.2 1.536 6.144 4.736 6.784zM273.536 290.432c2.432 2.432 6.528 2.432 8.96 0 2.432-2.432 2.432-6.528 0-8.96l-21.12-21.12c-2.432-2.432-6.528-2.432-8.96 0-2.432 2.432-2.432 6.528 0 8.96l21.12 21.12zM237.824 333.824c2.944 2.048 6.912 1.28 8.832-1.536 2.048-2.944 1.28-6.912-1.536-8.832l-24.448-17.152c-2.944-2.048-6.912-1.28-8.832 1.536s-1.28 6.912 1.536 8.832l24.448 17.152zM183.04 370.176l27.136 12.672c3.2 1.536 7.04 0.128 8.448-3.072 1.536-3.2 0.128-7.04-3.072-8.448l-27.136-12.672c-3.2-1.536-7.04-0.128-8.448 3.072-1.536 3.2-0.128 7.04 3.072 8.448zM194.688 423.68l-28.928-7.68c-3.456-0.896-6.912 1.152-7.808 4.48-0.896 3.456 1.152 6.912 4.48 7.808l28.928 7.68c3.456 0.896 6.912-1.152 7.808-4.48 0.896-3.456-1.152-6.912-4.48-7.808zM183.168 478.72l-29.824-2.56c-3.456-0.256-6.656 2.304-6.912 5.76-0.256 3.456 2.304 6.656 5.76 6.912l29.824 2.56c3.456 0.256 6.656-2.304 6.912-5.76 0.384-3.456-2.176-6.528-5.76-6.912zM181.504 535.04l-29.824 2.56c-3.456 0.256-6.144 3.456-5.76 6.912 0.256 3.456 3.456 6.144 6.912 5.76l29.824-2.56c3.456-0.256 6.144-3.456 5.76-6.912-0.256-3.456-3.328-6.016-6.912-5.76zM191.36 590.72l-28.928 7.68c-3.456 0.896-5.376 4.352-4.48 7.808 0.896 3.456 4.352 5.376 7.808 4.48l28.928-7.68c3.456-0.896 5.376-4.352 4.48-7.808-0.896-3.328-4.352-5.376-7.808-4.48zM207.232 644.224l-27.136 12.672c-3.2 1.536-4.608 5.248-3.072 8.448 1.536 3.2 5.248 4.608 8.448 3.072l27.136-12.672c3.2-1.536 4.608-5.248 3.072-8.448-1.408-3.2-5.248-4.48-8.448-3.072zM233.984 693.888l-24.448 17.152c-2.944 2.048-3.584 6.016-1.536 8.832 2.048 2.944 6.016 3.584 8.832 1.536l24.448-17.152c2.944-2.048 3.584-6.016 1.536-8.832-2.048-2.944-6.016-3.584-8.832-1.536zM310.912 775.552L293.76 800c-2.048 2.944-1.28 6.912 1.536 8.832 2.944 2.048 6.912 1.28 8.832-1.536l17.152-24.448c2.048-2.944 1.28-6.912-1.536-8.832-2.816-2.048-6.912-1.408-8.832 1.536zM349.184 840.704c3.2 1.536 7.04 0.128 8.448-3.072l12.672-27.136c1.536-3.2 0.128-7.04-3.072-8.448-3.2-1.536-7.04-0.128-8.448 3.072l-12.672 27.136c-1.408 3.2-0.128 6.912 3.072 8.448zM407.808 862.72c3.456 0.896 6.912-1.152 7.808-4.48l7.68-28.928c0.896-3.456-1.152-6.912-4.48-7.808-3.456-0.896-6.912 1.152-7.808 4.48l-7.68 28.928c-0.896 3.328 1.152 6.912 4.48 7.808zM469.376 874.112c3.456 0.256 6.656-2.304 6.912-5.76l2.56-29.824c0.256-3.456-2.304-6.656-5.76-6.912-3.456-0.256-6.656 2.304-6.912 5.76l-2.56 29.824c-0.256 3.584 2.304 6.656 5.76 6.912zM522.496 839.168l2.56 29.824c0.256 3.456 3.456 6.144 6.912 5.76 3.456-0.256 6.144-3.456 5.76-6.912l-2.56-29.824c-0.256-3.456-3.456-6.144-6.912-5.76-3.456 0.256-6.016 3.328-5.76 6.912zM578.176 830.976l7.68 28.928c0.896 3.456 4.352 5.376 7.808 4.48 3.456-0.896 5.376-4.352 4.48-7.808l-7.68-28.928c-0.896-3.456-4.352-5.376-7.808-4.48-3.328 0.896-5.376 4.48-4.48 7.808zM631.68 813.312l12.672 27.136c1.536 3.2 5.248 4.608 8.448 3.072 3.2-1.536 4.608-5.248 3.072-8.448l-12.672-27.136c-1.536-3.2-5.248-4.608-8.448-3.072-3.2 1.536-4.48 5.248-3.072 8.448zM681.344 786.688l17.152 24.448c2.048 2.944 6.016 3.584 8.832 1.536 2.944-2.048 3.584-6.016 1.536-8.832l-17.152-24.448c-2.048-2.944-6.016-3.584-8.832-1.536-2.944 1.92-3.584 5.888-1.536 8.832zM725.504 751.744l21.12 21.12c2.432 2.432 6.528 2.432 8.96 0 2.432-2.432 2.432-6.528 0-8.96l-21.12-21.12c-2.432-2.432-6.528-2.432-8.96 0-2.432 2.432-2.432 6.528 0 8.96zM763.008 709.76l24.448 17.152c2.944 2.048 6.912 1.28 8.832-1.536 2.048-2.944 1.28-6.912-1.536-8.832l-24.448-17.152c-2.944-2.048-6.912-1.28-8.832 1.536-2.048 2.816-1.408 6.784 1.536 8.832zM792.576 661.888l27.136 12.672c3.2 1.536 7.04 0.128 8.448-3.072 1.536-3.2 0.128-7.04-3.072-8.448l-27.136-12.672c-3.2-1.536-7.04-0.128-8.448 3.072-1.536 3.2-0.128 6.912 3.072 8.448zM813.44 609.536l28.928 7.68c3.456 0.896 6.912-1.152 7.808-4.48 0.896-3.456-1.152-6.912-4.48-7.808l-28.928-7.68c-3.456-0.896-6.912 1.152-7.808 4.48-0.896 3.456 1.024 6.912 4.48 7.808zM824.832 554.368l29.824 2.56c3.456 0.256 6.656-2.304 6.912-5.76 0.256-3.456-2.304-6.656-5.76-6.912l-29.824-2.56c-3.456-0.256-6.656 2.304-6.912 5.76-0.256 3.584 2.304 6.656 5.76 6.912zM826.624 498.176l29.824-2.56c3.456-0.256 6.144-3.456 5.76-6.912-0.256-3.456-3.456-6.144-6.912-5.76l-29.824 2.56c-3.456 0.256-6.144 3.456-5.76 6.912 0.256 3.456 3.328 6.016 6.912 5.76zM818.432 442.368l28.928-7.68c3.456-0.896 5.376-4.352 4.48-7.808-0.896-3.456-4.352-5.376-7.808-4.48l-28.928 7.68c-3.456 0.896-5.376 4.352-4.48 7.808 0.896 3.456 4.48 5.376 7.808 4.48zM800.768 388.992l27.136-12.672c3.2-1.536 4.608-5.248 3.072-8.448-1.536-3.2-5.248-4.608-8.448-3.072l-27.136 12.672c-3.2 1.536-4.608 5.248-3.072 8.448 1.536 3.072 5.248 4.48 8.448 3.072zM774.144 339.328l24.448-17.152c2.944-2.048 3.584-6.016 1.536-8.832-2.048-2.944-6.016-3.584-8.832-1.536L766.848 328.96c-2.944 2.048-3.584 6.016-1.536 8.832 1.92 2.816 5.888 3.584 8.832 1.536zM697.216 257.664l17.152-24.448c2.048-2.944 1.28-6.912-1.536-8.832-2.944-2.048-6.912-1.28-8.832 1.536l-17.152 24.448c-2.048 2.944-1.28 6.912 1.536 8.832 2.816 2.048 6.784 1.408 8.832-1.536zM658.944 192.512c-3.2-1.536-7.04-0.128-8.448 3.072l-12.672 27.136c-1.536 3.2-0.128 7.04 3.072 8.448 3.2 1.536 7.04 0.128 8.448-3.072l12.672-27.136c1.408-3.2 0-7.04-3.072-8.448zM600.192 170.496c-3.456-0.896-6.912 1.152-7.808 4.48l-7.68 28.928c-0.896 3.456 1.152 6.912 4.48 7.808 3.456 0.896 6.912-1.152 7.808-4.48l7.68-28.928c1.024-3.328-1.024-6.912-4.48-7.808zM534.912 201.6c3.456 0.256 6.656-2.304 6.912-5.76l2.56-29.824c0.256-3.456-2.304-6.656-5.76-6.912-3.456-0.256-6.656 2.304-6.912 5.76l-2.56 29.824c-0.256 3.456 2.304 6.528 5.76 6.912zM476.032 158.464c-3.456 0.256-6.144 3.456-5.76 6.912l2.56 29.824c0.256 3.456 3.456 6.144 6.912 5.76 3.456-0.256 6.144-3.456 5.76-6.912l-2.56-29.824c-0.256-3.456-3.328-6.016-6.912-5.76zM422.144 173.312c-0.896-3.456-4.352-5.376-7.808-4.48-3.456 0.896-5.376 4.352-4.48 7.808l7.68 28.928c0.896 3.456 4.352 5.376 7.808 4.48 3.456-0.896 5.376-4.352 4.48-7.808l-7.68-28.928zM376.448 219.776l-12.672-27.136c-1.536-3.2-5.248-4.608-8.448-3.072-3.2 1.536-4.608 5.248-3.072 8.448L364.8 225.28c1.536 3.2 5.248 4.608 8.448 3.072 3.2-1.536 4.608-5.376 3.2-8.576zM316.416 253.824c2.048 2.944 6.016 3.584 8.832 1.536 2.944-2.048 3.584-6.016 1.536-8.832l-17.152-24.448c-2.048-2.944-6.016-3.584-8.832-1.536-2.944 2.048-3.584 6.016-1.536 8.832l17.152 24.448z" fill="#FFFFFF" p-id="19071"></path></svg></div><div class="link_content"><div class="link_title">更新记录</div></div></a></div></p>
+]]></content>
+      <categories>
+        <category>个人小记</category>
+      </categories>
+      <tags>
+        <tag>个人小记</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>2024-05小记</title>
+    <url>/posts/10021/</url>
+    <content><![CDATA[<div class="tip success"><p>本文章已经同步到xLog：<a href="https://xlog.sinzmise.top/write-2024-05">https://xlog.sinzmise.top/write-2024-05</a> </p>
+</div>
+<p>久违的在n+1月前写n月小记。。。。。。<br>废话不多说，正片开始！</p>
+<h1 id="突如其来的通知"><a href="#突如其来的通知" class="headerlink" title="突如其来的通知"></a>突如其来的通知</h1><p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240526/网易灵犀办公_IaxXEglUuo.5mnn1fl6oo.webp" alt="来自博友圈的通知"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>说实在的，看到这个通知，我既感到意外，又觉得很不意外<br>因为之前我那文章封面都是loliapi生成的，而loliapi里面又诞生出了不少擦边图<br>目前已经将一批头图更换，并且准备半年后重新申请<br>如果申请还是不通过的话，那么就特别遗憾了<br>原本是想让博友圈的管理来改我那站点信息的，现在搞成那样，只能说下次注意了。。。。。。</p>
+<p><strong>2024-06-05更新：</strong><br>一周了都没给我回复，估计已经给我拉入黑名单了<br>那算了，既然这样的话，那这个链接就不打算留了<br>反正也是我自己一时的疏忽搞成的这样。。。。。。</p>
+<h1 id="全站npm化大翻车"><a href="#全站npm化大翻车" class="headerlink" title="全站npm化大翻车"></a>全站npm化大翻车</h1><p>在我逛逛友链朋友圈的时候发现了这么一篇文章：<br><div class="tag link"><a class="link_card" referrerPolicy="no-referrer" title="hexo全站NPM化之·通过npmmirror加速你的博客访问" href="https://byer.top/posts/2c8698f6.html"><div class="link_icon"><img src="https://byer.top/img/ava.jpg" class="no-lightbox"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></div><div class="link_content"><div class="link_title">hexo全站NPM化之·通过npmmirror加速你的博客访问</div><div class="link_desc">估计是由CyanFalse大佬的文章发现的灵感。。。。。</div></div></a></div><br>之前CyanFalse大佬那个我看不懂，而且懂了也不知道怎么写QWQ<br>于是我开始安装这个教程来搞全站npm化<br>结果这么一搞，反而拖慢了站点加载速度，而且：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240526/msedge_2sU7KOaR53.wie317mx5.webp" alt="f12发现的错误"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>我原本以为是npmmirror的问题，毕竟大佬说了NPM已经开启了白名单模式<br>但尽管我换成jsd和unpkg也依然是这个情况<br>只能取消全站npm化<br>后面我去问下大佬是怎么回事吧。。。。。。</p>
+<h1 id="站点添加Ruffle"><a href="#站点添加Ruffle" class="headerlink" title="站点添加Ruffle"></a>站点添加Ruffle</h1><p>没错，我又给站点添加回Ruffle了<br>话说回来，估计我认识的这些搞博客的站长中，只有我对swf依然是最感兴趣了吧。。。。。。<br>如果你还不知道Ruffle是什么的话，可以去看看我这篇文章：<br><div class="tag link"><a class="link_card" referrerPolicy="no-referrer" title="Ruffle测试" href="https://blog.sinzmise.top/posts/57692/"><div class="link_icon"><svg t="1670307855063" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="19066" width="200" height="200"><path d="M504.064 516.608m-384.256 0a384.256 384.256 0 1 0 768.512 0 384.256 384.256 0 1 0-768.512 0Z" fill="#009CF5" p-id="19068"></path><path d="M746.112 270.464L472.448 485.12l63.104 63.104L750.08 274.56c2.304-2.688-1.28-6.144-3.968-4.096z" fill="#FF4C3A" p-id="19069"></path><path d="M262.016 762.752l273.664-214.528-63.104-63.104-214.656 273.536c-2.176 2.688 1.28 6.144 4.096 4.096z" fill="#FFFFFF" p-id="19070"></path><path d="M505.216 155.136c-3.2 0-5.888 2.56-5.888 5.888v53.504c0 3.2 2.56 5.888 5.888 5.888s5.888-2.56 5.888-5.888v-53.504c-0.128-3.2-2.688-5.888-5.888-5.888zM442.368 160.512c-3.2 0.512-5.376 3.584-4.736 6.784l9.344 52.736c0.512 3.2 3.584 5.376 6.784 4.736 3.2-0.512 5.376-3.584 4.736-6.784l-9.344-52.736c-0.512-3.2-3.584-5.376-6.784-4.736zM396.288 234.368c1.152 3.072 4.48 4.608 7.552 3.456 3.072-1.152 4.608-4.48 3.456-7.552l-18.304-50.304c-1.152-3.072-4.48-4.608-7.552-3.456-3.072 1.152-4.608 4.48-3.456 7.552l18.304 50.304zM348.928 257.408c1.664 2.816 5.248 3.712 7.936 2.176s3.712-5.248 2.176-7.936l-26.752-46.336c-1.664-2.816-5.248-3.712-7.936-2.176-2.816 1.664-3.712 5.248-2.176 7.936l26.752 46.336zM306.304 288.256c2.048 2.432 5.76 2.816 8.192 0.768 2.432-2.048 2.816-5.76 0.768-8.192l-34.432-40.96c-2.048-2.432-5.76-2.816-8.192-0.768-2.432 2.048-2.816 5.76-0.768 8.192l34.432 40.96zM269.696 326.144c2.432 2.048 6.144 1.792 8.192-0.768 2.048-2.432 1.792-6.144-0.768-8.192l-40.96-34.432c-2.432-2.048-6.144-1.792-8.192 0.768-2.048 2.432-1.792 6.144 0.768 8.192l40.96 34.432zM193.792 342.912l46.336 26.752c2.816 1.664 6.4 0.64 7.936-2.176 1.664-2.816 0.64-6.4-2.176-8.064L199.552 332.8c-2.816-1.664-6.4-0.64-7.936 2.176-1.664 2.688-0.64 6.272 2.176 7.936zM168.32 399.488l50.304 18.304c3.072 1.152 6.4-0.512 7.552-3.456 1.152-3.072-0.512-6.4-3.456-7.552l-50.304-18.304c-3.072-1.152-6.4 0.512-7.552 3.456-1.152 3.072 0.384 6.4 3.456 7.552zM207.872 457.344l-52.736-9.344c-3.2-0.512-6.272 1.536-6.784 4.736-0.512 3.2 1.536 6.272 4.736 6.784l52.736 9.344c3.2 0.512 6.272-1.536 6.784-4.736 0.512-3.2-1.536-6.272-4.736-6.784zM201.984 509.568H148.48c-3.2 0-5.888 2.56-5.888 5.888 0 3.2 2.56 5.888 5.888 5.888h53.504c3.2 0 5.888-2.56 5.888-5.888 0-3.2-2.56-5.888-5.888-5.888zM205.44 562.176l-52.736 9.344c-3.2 0.512-5.376 3.584-4.736 6.784 0.512 3.2 3.584 5.376 6.784 4.736l52.736-9.344c3.2-0.512 5.376-3.584 4.736-6.784s-3.584-5.248-6.784-4.736zM217.856 613.376l-50.304 18.304c-3.072 1.152-4.608 4.48-3.456 7.552 1.152 3.072 4.48 4.608 7.552 3.456l50.304-18.304c3.072-1.152 4.608-4.48 3.456-7.552-1.152-3.072-4.48-4.608-7.552-3.456zM238.976 661.504l-46.336 26.752c-2.816 1.664-3.712 5.248-2.176 8.064 1.664 2.816 5.248 3.712 8.064 2.176l46.336-26.752c2.816-1.664 3.712-5.248 2.176-8.064-1.664-2.816-5.248-3.712-8.064-2.176zM268.16 705.408l-40.96 34.432c-2.432 2.048-2.816 5.76-0.768 8.192 2.048 2.432 5.76 2.816 8.192 0.768l40.96-34.432c2.432-2.048 2.816-5.76 0.768-8.192-1.92-2.56-5.632-2.816-8.192-0.768zM304.512 743.424l-34.432 40.96c-2.048 2.432-1.792 6.144 0.768 8.192 2.432 2.048 6.144 1.792 8.192-0.768l34.432-40.96c2.048-2.432 1.792-6.144-0.768-8.192-2.304-1.92-6.016-1.664-8.192 0.768zM347.008 774.656l-26.752 46.336c-1.664 2.816-0.64 6.4 2.176 7.936 2.816 1.664 6.4 0.64 8.064-2.176l26.752-46.336c1.664-2.816 0.64-6.4-2.176-7.936-2.816-1.536-6.4-0.64-8.064 2.176zM394.24 798.08l-18.304 50.304c-1.152 3.072 0.512 6.4 3.456 7.552 3.072 1.152 6.4-0.512 7.552-3.456l18.304-50.304c1.152-3.072-0.512-6.4-3.456-7.552-3.072-1.152-6.528 0.384-7.552 3.456zM440.192 872.32c3.2 0.512 6.272-1.536 6.784-4.736l9.344-52.736c0.512-3.2-1.536-6.272-4.736-6.784-3.2-0.512-6.272 1.536-6.784 4.736l-9.344 52.736c-0.64 3.2 1.536 6.272 4.736 6.784zM502.912 878.08c3.2 0 5.888-2.56 5.888-5.888v-53.504c0-3.2-2.56-5.888-5.888-5.888-3.2 0-5.888 2.56-5.888 5.888v53.504c0 3.2 2.688 5.888 5.888 5.888zM549.632 815.232l9.344 52.736c0.512 3.2 3.584 5.376 6.784 4.736 3.2-0.512 5.376-3.584 4.736-6.784l-9.344-52.736c-0.512-3.2-3.584-5.376-6.784-4.736-3.2 0.512-5.248 3.584-4.736 6.784zM600.832 802.816l18.304 50.304c1.152 3.072 4.48 4.608 7.552 3.456 3.072-1.152 4.608-4.48 3.456-7.552L611.84 798.72c-1.152-3.072-4.48-4.608-7.552-3.456-3.072 1.152-4.608 4.48-3.456 7.552zM649.088 781.696l26.752 46.336c1.664 2.816 5.248 3.712 8.064 2.176 2.816-1.664 3.712-5.248 2.176-8.064l-26.88-46.336c-1.664-2.816-5.248-3.712-8.064-2.176-2.816 1.664-3.712 5.248-2.048 8.064zM692.864 752.384l34.432 40.96c2.048 2.432 5.76 2.816 8.192 0.768 2.432-2.048 2.816-5.76 0.768-8.192l-34.432-40.96c-2.048-2.432-5.76-2.816-8.192-0.768-2.56 2.048-2.816 5.76-0.768 8.192zM730.88 716.032l40.96 34.432c2.432 2.048 6.144 1.792 8.192-0.768 2.048-2.432 1.792-6.144-0.768-8.192l-40.96-34.432c-2.432-2.048-6.144-1.792-8.192 0.768-1.92 2.432-1.664 6.144 0.768 8.192zM762.112 673.664l46.336 26.752c2.816 1.664 6.4 0.64 8.064-2.176 1.664-2.816 0.64-6.4-2.176-7.936L768 663.552c-2.816-1.664-6.4-0.64-8.064 2.176-1.536 2.688-0.64 6.272 2.176 7.936zM785.536 626.432l50.304 18.304c3.072 1.152 6.4-0.512 7.552-3.456 1.152-3.072-0.512-6.4-3.456-7.552l-50.304-18.304c-3.072-1.152-6.4 0.512-7.552 3.456-1.152 3.072 0.384 6.4 3.456 7.552zM800.256 575.872l52.736 9.344c3.2 0.512 6.272-1.536 6.784-4.736 0.512-3.2-1.536-6.272-4.736-6.784l-52.736-9.344c-3.2-0.512-6.272 1.536-6.784 4.736-0.512 3.2 1.536 6.272 4.736 6.784zM800.256 517.76c0 3.2 2.56 5.888 5.888 5.888h53.504c3.2 0 5.888-2.56 5.888-5.888 0-3.2-2.56-5.888-5.888-5.888h-53.504c-3.328 0-5.888 2.56-5.888 5.888zM802.688 471.04l52.736-9.344c3.2-0.512 5.376-3.584 4.736-6.784-0.512-3.2-3.584-5.376-6.784-4.736l-52.736 9.344c-3.2 0.512-5.376 3.584-4.736 6.784 0.512 3.2 3.584 5.248 6.784 4.736zM790.272 419.84l50.304-18.304c3.072-1.152 4.608-4.48 3.456-7.552-1.152-3.072-4.48-4.608-7.552-3.456l-50.304 18.304c-3.072 1.152-4.608 4.48-3.456 7.552 1.152 2.944 4.48 4.608 7.552 3.456zM769.152 371.584l46.336-26.752c2.816-1.664 3.712-5.248 2.176-7.936-1.664-2.816-5.248-3.712-8.064-2.176l-46.336 26.752c-2.816 1.664-3.712 5.248-2.176 8.064 1.664 2.688 5.248 3.712 8.064 2.048zM739.84 327.808l40.96-34.432c2.432-2.048 2.816-5.76 0.768-8.192-2.048-2.432-5.76-2.816-8.192-0.768l-40.96 34.432c-2.432 2.048-2.816 5.76-0.768 8.192 2.048 2.56 5.76 2.816 8.192 0.768zM703.488 289.664l34.432-40.96c2.048-2.432 1.792-6.144-0.768-8.192-2.432-2.048-6.144-1.792-8.192 0.768l-34.432 40.96c-2.048 2.432-1.792 6.144 0.768 8.192 2.432 2.048 6.144 1.792 8.192-0.768zM661.12 258.56l26.752-46.336c1.664-2.816 0.64-6.4-2.176-7.936-2.816-1.664-6.4-0.64-8.064 2.176l-26.752 46.336c-1.664 2.816-0.64 6.4 2.176 7.936 2.816 1.536 6.4 0.64 8.064-2.176zM613.888 235.136l18.304-50.304c1.152-3.072-0.512-6.4-3.456-7.552-3.072-1.152-6.4 0.512-7.552 3.456L602.88 231.168c-1.152 3.072 0.512 6.4 3.456 7.552 3.072 1.024 6.4-0.512 7.552-3.584zM556.544 225.152c3.2 0.512 6.272-1.536 6.784-4.736l9.344-52.736c0.512-3.2-1.536-6.272-4.736-6.784-3.2-0.512-6.272 1.536-6.784 4.736l-9.344 52.736c-0.512 3.2 1.536 6.144 4.736 6.784zM273.536 290.432c2.432 2.432 6.528 2.432 8.96 0 2.432-2.432 2.432-6.528 0-8.96l-21.12-21.12c-2.432-2.432-6.528-2.432-8.96 0-2.432 2.432-2.432 6.528 0 8.96l21.12 21.12zM237.824 333.824c2.944 2.048 6.912 1.28 8.832-1.536 2.048-2.944 1.28-6.912-1.536-8.832l-24.448-17.152c-2.944-2.048-6.912-1.28-8.832 1.536s-1.28 6.912 1.536 8.832l24.448 17.152zM183.04 370.176l27.136 12.672c3.2 1.536 7.04 0.128 8.448-3.072 1.536-3.2 0.128-7.04-3.072-8.448l-27.136-12.672c-3.2-1.536-7.04-0.128-8.448 3.072-1.536 3.2-0.128 7.04 3.072 8.448zM194.688 423.68l-28.928-7.68c-3.456-0.896-6.912 1.152-7.808 4.48-0.896 3.456 1.152 6.912 4.48 7.808l28.928 7.68c3.456 0.896 6.912-1.152 7.808-4.48 0.896-3.456-1.152-6.912-4.48-7.808zM183.168 478.72l-29.824-2.56c-3.456-0.256-6.656 2.304-6.912 5.76-0.256 3.456 2.304 6.656 5.76 6.912l29.824 2.56c3.456 0.256 6.656-2.304 6.912-5.76 0.384-3.456-2.176-6.528-5.76-6.912zM181.504 535.04l-29.824 2.56c-3.456 0.256-6.144 3.456-5.76 6.912 0.256 3.456 3.456 6.144 6.912 5.76l29.824-2.56c3.456-0.256 6.144-3.456 5.76-6.912-0.256-3.456-3.328-6.016-6.912-5.76zM191.36 590.72l-28.928 7.68c-3.456 0.896-5.376 4.352-4.48 7.808 0.896 3.456 4.352 5.376 7.808 4.48l28.928-7.68c3.456-0.896 5.376-4.352 4.48-7.808-0.896-3.328-4.352-5.376-7.808-4.48zM207.232 644.224l-27.136 12.672c-3.2 1.536-4.608 5.248-3.072 8.448 1.536 3.2 5.248 4.608 8.448 3.072l27.136-12.672c3.2-1.536 4.608-5.248 3.072-8.448-1.408-3.2-5.248-4.48-8.448-3.072zM233.984 693.888l-24.448 17.152c-2.944 2.048-3.584 6.016-1.536 8.832 2.048 2.944 6.016 3.584 8.832 1.536l24.448-17.152c2.944-2.048 3.584-6.016 1.536-8.832-2.048-2.944-6.016-3.584-8.832-1.536zM310.912 775.552L293.76 800c-2.048 2.944-1.28 6.912 1.536 8.832 2.944 2.048 6.912 1.28 8.832-1.536l17.152-24.448c2.048-2.944 1.28-6.912-1.536-8.832-2.816-2.048-6.912-1.408-8.832 1.536zM349.184 840.704c3.2 1.536 7.04 0.128 8.448-3.072l12.672-27.136c1.536-3.2 0.128-7.04-3.072-8.448-3.2-1.536-7.04-0.128-8.448 3.072l-12.672 27.136c-1.408 3.2-0.128 6.912 3.072 8.448zM407.808 862.72c3.456 0.896 6.912-1.152 7.808-4.48l7.68-28.928c0.896-3.456-1.152-6.912-4.48-7.808-3.456-0.896-6.912 1.152-7.808 4.48l-7.68 28.928c-0.896 3.328 1.152 6.912 4.48 7.808zM469.376 874.112c3.456 0.256 6.656-2.304 6.912-5.76l2.56-29.824c0.256-3.456-2.304-6.656-5.76-6.912-3.456-0.256-6.656 2.304-6.912 5.76l-2.56 29.824c-0.256 3.584 2.304 6.656 5.76 6.912zM522.496 839.168l2.56 29.824c0.256 3.456 3.456 6.144 6.912 5.76 3.456-0.256 6.144-3.456 5.76-6.912l-2.56-29.824c-0.256-3.456-3.456-6.144-6.912-5.76-3.456 0.256-6.016 3.328-5.76 6.912zM578.176 830.976l7.68 28.928c0.896 3.456 4.352 5.376 7.808 4.48 3.456-0.896 5.376-4.352 4.48-7.808l-7.68-28.928c-0.896-3.456-4.352-5.376-7.808-4.48-3.328 0.896-5.376 4.48-4.48 7.808zM631.68 813.312l12.672 27.136c1.536 3.2 5.248 4.608 8.448 3.072 3.2-1.536 4.608-5.248 3.072-8.448l-12.672-27.136c-1.536-3.2-5.248-4.608-8.448-3.072-3.2 1.536-4.48 5.248-3.072 8.448zM681.344 786.688l17.152 24.448c2.048 2.944 6.016 3.584 8.832 1.536 2.944-2.048 3.584-6.016 1.536-8.832l-17.152-24.448c-2.048-2.944-6.016-3.584-8.832-1.536-2.944 1.92-3.584 5.888-1.536 8.832zM725.504 751.744l21.12 21.12c2.432 2.432 6.528 2.432 8.96 0 2.432-2.432 2.432-6.528 0-8.96l-21.12-21.12c-2.432-2.432-6.528-2.432-8.96 0-2.432 2.432-2.432 6.528 0 8.96zM763.008 709.76l24.448 17.152c2.944 2.048 6.912 1.28 8.832-1.536 2.048-2.944 1.28-6.912-1.536-8.832l-24.448-17.152c-2.944-2.048-6.912-1.28-8.832 1.536-2.048 2.816-1.408 6.784 1.536 8.832zM792.576 661.888l27.136 12.672c3.2 1.536 7.04 0.128 8.448-3.072 1.536-3.2 0.128-7.04-3.072-8.448l-27.136-12.672c-3.2-1.536-7.04-0.128-8.448 3.072-1.536 3.2-0.128 6.912 3.072 8.448zM813.44 609.536l28.928 7.68c3.456 0.896 6.912-1.152 7.808-4.48 0.896-3.456-1.152-6.912-4.48-7.808l-28.928-7.68c-3.456-0.896-6.912 1.152-7.808 4.48-0.896 3.456 1.024 6.912 4.48 7.808zM824.832 554.368l29.824 2.56c3.456 0.256 6.656-2.304 6.912-5.76 0.256-3.456-2.304-6.656-5.76-6.912l-29.824-2.56c-3.456-0.256-6.656 2.304-6.912 5.76-0.256 3.584 2.304 6.656 5.76 6.912zM826.624 498.176l29.824-2.56c3.456-0.256 6.144-3.456 5.76-6.912-0.256-3.456-3.456-6.144-6.912-5.76l-29.824 2.56c-3.456 0.256-6.144 3.456-5.76 6.912 0.256 3.456 3.328 6.016 6.912 5.76zM818.432 442.368l28.928-7.68c3.456-0.896 5.376-4.352 4.48-7.808-0.896-3.456-4.352-5.376-7.808-4.48l-28.928 7.68c-3.456 0.896-5.376 4.352-4.48 7.808 0.896 3.456 4.48 5.376 7.808 4.48zM800.768 388.992l27.136-12.672c3.2-1.536 4.608-5.248 3.072-8.448-1.536-3.2-5.248-4.608-8.448-3.072l-27.136 12.672c-3.2 1.536-4.608 5.248-3.072 8.448 1.536 3.072 5.248 4.48 8.448 3.072zM774.144 339.328l24.448-17.152c2.944-2.048 3.584-6.016 1.536-8.832-2.048-2.944-6.016-3.584-8.832-1.536L766.848 328.96c-2.944 2.048-3.584 6.016-1.536 8.832 1.92 2.816 5.888 3.584 8.832 1.536zM697.216 257.664l17.152-24.448c2.048-2.944 1.28-6.912-1.536-8.832-2.944-2.048-6.912-1.28-8.832 1.536l-17.152 24.448c-2.048 2.944-1.28 6.912 1.536 8.832 2.816 2.048 6.784 1.408 8.832-1.536zM658.944 192.512c-3.2-1.536-7.04-0.128-8.448 3.072l-12.672 27.136c-1.536 3.2-0.128 7.04 3.072 8.448 3.2 1.536 7.04 0.128 8.448-3.072l12.672-27.136c1.408-3.2 0-7.04-3.072-8.448zM600.192 170.496c-3.456-0.896-6.912 1.152-7.808 4.48l-7.68 28.928c-0.896 3.456 1.152 6.912 4.48 7.808 3.456 0.896 6.912-1.152 7.808-4.48l7.68-28.928c1.024-3.328-1.024-6.912-4.48-7.808zM534.912 201.6c3.456 0.256 6.656-2.304 6.912-5.76l2.56-29.824c0.256-3.456-2.304-6.656-5.76-6.912-3.456-0.256-6.656 2.304-6.912 5.76l-2.56 29.824c-0.256 3.456 2.304 6.528 5.76 6.912zM476.032 158.464c-3.456 0.256-6.144 3.456-5.76 6.912l2.56 29.824c0.256 3.456 3.456 6.144 6.912 5.76 3.456-0.256 6.144-3.456 5.76-6.912l-2.56-29.824c-0.256-3.456-3.328-6.016-6.912-5.76zM422.144 173.312c-0.896-3.456-4.352-5.376-7.808-4.48-3.456 0.896-5.376 4.352-4.48 7.808l7.68 28.928c0.896 3.456 4.352 5.376 7.808 4.48 3.456-0.896 5.376-4.352 4.48-7.808l-7.68-28.928zM376.448 219.776l-12.672-27.136c-1.536-3.2-5.248-4.608-8.448-3.072-3.2 1.536-4.608 5.248-3.072 8.448L364.8 225.28c1.536 3.2 5.248 4.608 8.448 3.072 3.2-1.536 4.608-5.376 3.2-8.576zM316.416 253.824c2.048 2.944 6.016 3.584 8.832 1.536 2.944-2.048 3.584-6.016 1.536-8.832l-17.152-24.448c-2.048-2.944-6.016-3.584-8.832-1.536-2.944 2.048-3.584 6.016-1.536 8.832l17.152 24.448z" fill="#FFFFFF" p-id="19071"></path></svg></div><div class="link_content"><div class="link_title">Ruffle测试</div></div></a></div></p>
+<h1 id="Hello，xLog"><a href="#Hello，xLog" class="headerlink" title="Hello，xLog"></a>Hello，xLog</h1><p>在别的地方了解到了 xLog 这个使用区块链技术存储数据的博客平台<br>而且看见有一堆大佬也从 Hexo 迁移到 xLog<br>在好奇之下我便搞了这玩意</p>
+<p>怎么说呢，虽然这玩意有着高度可定制的需求，并且能保证数据是安全的<br>而且因为用的区块链，使得数据在得到安全的情况下，可以通过区块链可以赚取代币</p>
+<p>但也是因为用的区块链，而链上操作是透明且不可撤销的，其他人可以通过区块链历史查看文章的修改历史<br>也因此导致它虽然能删除文章，但不算真正无法真正删除一篇文章（简称：如删）<br>但这还不是重点，重点是：不能引入 JS（重点， 因为这样的话我没法引入 Ruffle 了。。。。。。 ），并且没有主题</p>
+<p>并且也可能是因为我 Hexo 用习惯了，面对这种博客后台，我居然有点不太习惯<br>但还好，xLog 能导入 MarkDown 文件，并且支持 Front Matter</p>
+<p>也因此，后面我打算让 Hexo 和 xLog 同步更新<br>（虽然这得耗费不少时间，但是我喜欢折腾的乐趣，然而我没想到的是这玩意居然能添加开往的链接，这也是我没想到的，但这里文章太少，后面我打算文章多一点之后再去试试看能不能申请加入开往吧。。。。。。。。。。）</p>
+<p>至于我那 xLog 站点的名字，既然我给 Hexo 的主题 UI 是 CetaStories（名字修改于希腊字母 Theta）</p>
+<p>那名字决定了！那个xLog博客名字就叫星空魔法书・Delta 吧！<br>我的xLog链接：<a href="https://xlog.sinzmise.top/">https://xlog.sinzmise.top/</a></p>
+<p>以上</p>
+]]></content>
+      <categories>
+        <category>个人小记</category>
+      </categories>
+      <tags>
+        <tag>个人小记</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>2024-06小记</title>
+    <url>/posts/64935/</url>
+    <content><![CDATA[<p>很好，马上就快到暑假了，但我得7月11日才开始正式放暑假。。。。。。<br>（bobo和小何、安小歪都已经开始放暑假了。。。。。。）<br>算了，正片开始吧</p>
+<h1 id="全站npm化成功"><a href="#全站npm化成功" class="headerlink" title="全站npm化成功"></a>全站npm化成功</h1><p>经历了多次翻车之后，本站的全站npm化终于成功了<br>我那全站npm化的方案与byer那篇文章不同，我的方案是将hexo-swpp和<a href="https://blog.eurekac.cn/p/d3c51290.html">cyanfalse大佬的教程</a>结合起来<br>实现了npm版本自定义更新、采用CacheStorage存储来实现ServiceWorker的全局变量持久化</p>
+<p><del>（结果因为英文站那边出现问题，导致我不得不再次放弃全站npm化）</del>（修好了）</p>
+<h1 id="成功搞indleweb"><a href="#成功搞indleweb" class="headerlink" title="成功搞indleweb"></a>成功搞indleweb</h1><p>之前我说过，要把indleweb搞好的<br>现在终于好了<br>并且已经加入了indleweb webring<br>英文站的话。。。。。还在测试，因为并不是完全是英文的，还在修改</p>
+<h1 id="收藏了几台手机"><a href="#收藏了几台手机" class="headerlink" title="收藏了几台手机"></a>收藏了几台手机</h1><p>这些都是之前在闲鱼上看见的<br>其中有一台说是配件机，说是不能开机<br>结果被我搞开机了</p>
+<p>然后这三台我都给它们换了主题<br>换完主题的效果：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240705/d76602a274135b80c62d56bd26c758a.4xuf2npsag.webp" alt="d76602a274135b80c62d56bd26c758a"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240705/0dbf4a6d201aa874c099abce975c7cb.1lbp8a96lv.webp" alt="0dbf4a6d201aa874c099abce975c7cb"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p>以上（虽然还有一场考试。。。。。但是是在下周四）</p>
+]]></content>
+      <categories>
+        <category>个人小记</category>
+      </categories>
+      <tags>
+        <tag>个人小记</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>2024-07小记</title>
+    <url>/posts/15799/</url>
+    <content><![CDATA[<p>依然还是每个月的个人小记啦<br>虽然这个月出了一点事故，但也是有一点惊喜的啦 ~~~<br>话不多说，正片开始</p>
+<h1 id="初入罗德岛"><a href="#初入罗德岛" class="headerlink" title="初入罗德岛"></a>初入罗德岛</h1><p>看到罗德岛，你们知道我干啥了吧<br>没错，我入坑《明日方舟》了<br>我原本是想说小何让我入坑《绝区零》的事情的，结果那次我祖奶奶过世再加上我弟生病，导致我这几天根本没心情玩<br>也因此对绝区零也没什么太大印象，只能说说方舟的事情</p>
+<p>入坑的是国际服（国服的话。。。。。懂得都懂）<br>但是这暑假的一堆事情和小何给我的一大堆事情，再加上补习，让我没怎么玩过游戏（甚至连ba，赛马娘和大碧蓝都没玩了，）</p>
+<p>后面也懒得给这游戏做评价了，反正游戏嘛，能放轻松就行</p>
+<h1 id="成为小众网vip"><a href="#成为小众网vip" class="headerlink" title="成为小众网vip"></a>成为小众网vip</h1><p>我上篇小记不是收藏了一些机子吗？<br>我之前想给这些机子安装几款游戏玩玩，但是无奈我想找的只有去小众网才有</p>
+<p>于是我花9.9买下小众网一年会员<br>虽然我不怎么下载这里面的软件了。。。。。就当是支持小众网吧~~<br>（反正这个月入手了几台新机子，后面想给这些机子下载软件也很方便）</p>
+<h1 id="淘到的新机子"><a href="#淘到的新机子" class="headerlink" title="淘到的新机子"></a>淘到的新机子</h1><p>还是老样子，来看看我这个月收藏了什么老机子吧：</p>
+<h2 id="三星M128"><a href="#三星M128" class="headerlink" title="三星M128"></a>三星M128</h2><p>这台原计划是两天到达的，但是因为台风导致拖了一天<br><psw>有人甚至还说被风吹飞了，这要是被风吹飞了我可能会当场裂开，毕竟这可是稀有机子，还是奥运会特别纪念手机。。。。。</psw></p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240731/c1a54fbb55916d8f6620dddf757751d.lvmw822eq.jpg" alt="1"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240731/6fc6b0db81948cb34832ca40e11ec50.6t70wdy9dj.jpg" alt="2"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p>这台的右键貌似有问题，每次都得用力按一下才能点到右边<br>算了，反正是稀有机子嘛，就别要求这么多啦。。。。</p>
+<h2 id="PPC-三-兄-贵-——-三星Omnia-I900V-I908-I908L"><a href="#PPC-三-兄-贵-——-三星Omnia-I900V-I908-I908L" class="headerlink" title="PPC 三 兄 贵 —— 三星Omnia I900V/I908/I908L"></a>PPC 三 兄 贵 —— 三星Omnia I900V/I908/I908L</h2><p>其实那I900V就是我上个小记说的那PPC，这次确实搞到了三台，只不过是两台I908L和一台I908<br>其中一台I908L屏幕是坏的，刚好我有一台I900V那外壳是坏的，索性就把外壳拆下来装到那I900V上来了</p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240731/613ebc652ab401e77260183401c41b0.2venfpyhas.jpg" alt="1"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<h2 id="第二台摩托罗拉-——-摩托罗拉-明A1200"><a href="#第二台摩托罗拉-——-摩托罗拉-明A1200" class="headerlink" title="第二台摩托罗拉 —— 摩托罗拉 明A1200"></a>第二台摩托罗拉 —— 摩托罗拉 明A1200</h2><p>那次看完《保持通话》这个电影之后就一直想搞台这个了<br>（其实我原本想要的是A1600，然后找不到便宜的，只能a1200）</p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240731/95f222caa18e68ac9f4291bfdb5d4e6.51e21hq6w3.jpg" alt="1"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240731/416fd6ec87046b4960c74d571c72ee7.73tupjoth9.jpg" alt="2"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p>可惜的是这个貌似听筒是坏掉的，后面等我搞到个好的听筒再来发照片吧</p>
+<h2 id="第三台摩托罗拉-——-摩托罗拉-刀锋V3"><a href="#第三台摩托罗拉-——-摩托罗拉-刀锋V3" class="headerlink" title="第三台摩托罗拉 —— 摩托罗拉 刀锋V3"></a>第三台摩托罗拉 —— 摩托罗拉 刀锋V3</h2><p>（别问第一台是什么，第一台是C289，黑白屏的，很久之前从我外婆那边收到的）<br>这台我其实是买了两台<br>有一台被当作另一台的配件机了<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240731/020d1e7c98affcf11c42805e0d173fe.1e8idyuhdn.jpg" alt="1"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240731/f50d9ac7fb46d8f6b7506fb5c34ebe4.2venfpyn60.jpg" alt="2"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>不愧是刀锋，这手感放在2024都不过时<br>可惜的是在此之后摩托罗拉据说是错过了安卓，导致移动业务被收购了。。。。。</p>
+<p>其它的先不展示。。。。。这个月淘到的机子有一点多了。。。。</p>
+<p>以上</p>
+]]></content>
+      <categories>
+        <category>个人小记</category>
+      </categories>
+      <tags>
+        <tag>个人小记</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>2024-08小记</title>
+    <url>/posts/15688/</url>
+    <content><![CDATA[<p>时间过得真快，转眼间暑假就快结束了<br>还是这样，一个月一次的小记，安排！</p>
+<h1 id="久违的旅游"><a href="#久违的旅游" class="headerlink" title="久违的旅游"></a>久违的旅游</h1><p>8月28日，也算是这个暑假的唯一一次旅游<br>虽然只有半天，但是也足够了</p>
+<p>那次旅游的目的地是揭阳惠来，一共有三站：</p>
+<h2 id="第一站：客鸟尾石笋区"><a href="#第一站：客鸟尾石笋区" class="headerlink" title="第一站：客鸟尾石笋区"></a>第一站：客鸟尾石笋区</h2><p>初来乍到，要爬上石笋很不容易<br>但爬上去之后看到的风景尽收眼底，我就知道这一爬也值得了<br>上照片：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/6d151d58a8d72c9aa628a25899ba0bd.1e8jn988h8.jpg" alt="6d151d58a8d72c9aa628a25899ba0bd"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/31a2efc188ed78b139427b8cbc0ac64.3yedzw8i2o.jpg" alt="31a2efc188ed78b139427b8cbc0ac64"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/7994801d0f2edbfff94f00118c87433.361ii5s324.jpg" alt="7994801d0f2edbfff94f00118c87433"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/874d49afb470b6728ba43a69e1c0945.45hlvbuy2b.jpg" alt="874d49afb470b6728ba43a69e1c0945"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/0d561f893d8c63f3a16057373f4fe14.6t725oo2un.jpg" alt="0d561f893d8c63f3a16057373f4fe14"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<h2 id="第二站：网红彩虹桥"><a href="#第二站：网红彩虹桥" class="headerlink" title="第二站：网红彩虹桥"></a>第二站：网红彩虹桥</h2><p>实际上就是揭阳那边的码头，没啥好看的<br>整体感觉还不如第一站和第三站<br>因此照片我不打算展示出来<br>直接第三站走起~~</p>
+<h2 id="第三站：滨河湾旅游景区"><a href="#第三站：滨河湾旅游景区" class="headerlink" title="第三站：滨河湾旅游景区"></a>第三站：滨河湾旅游景区</h2><p>时间最长，也是我逛得最满意的景点~~<br>而且这个景点有天空之镜<psw>（虽然之前被群友吐槽过，并且有报道也吐槽了这玩意。。。。）</psw>和望远镜<psw>（虽然是要收费的。。。。。）</psw><br>观赏完风景我们就开始吃烧烤<br>可惜没有KTV，不过就半天的活动要啥ktv呢。。。。<br>不多说了，照片走起~~（虽然没有烧烤的。。。。。）<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/4d86b6602efda6086807b108e86f12c.51e3aw62e3.jpg" alt="4d86b6602efda6086807b108e86f12c"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/ac7321a92e148651db9da6144271ab8.2obgtosbul.jpg" alt="ac7321a92e148651db9da6144271ab8"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/d9854d1e396ac8134a4b9e7a77500e8.9rjc9axx7y.jpg" alt="d9854d1e396ac8134a4b9e7a77500e8"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/81c936cb167b8361693d3d65d49b526.8l010p94sj.jpg" alt="81c936cb167b8361693d3d65d49b526"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/4d1fbe0f19bf6b80f0939405e9b23ff.3nrk6uvimx.jpg" alt="4d1fbe0f19bf6b80f0939405e9b23ff"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/2618e9e67b53d868eead5a2d370199d.41xzxq5gko.jpg" alt="2618e9e67b53d868eead5a2d370199d"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>在望远镜那边拍的：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/aaabe2c0194f1f62495c47167185d8a.lvo5mub12.jpg" alt="aaabe2c0194f1f62495c47167185d8a"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/41f870985b36dcf039f445fdb6b11a7.3k7y953l6b.jpg" alt="41f870985b36dcf039f445fdb6b11a7"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/a5abb6942b0a25d05f89571d580bf38.361ii9vf7a.jpg" alt="a5abb6942b0a25d05f89571d580bf38"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/4c7592b019561d39ca9ea4089424517.3nrk6uwvmq.jpg" alt="4c7592b019561d39ca9ea4089424517"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/d540e08539fda0ad40036505af75da7.6f0mexj654.jpg" alt="d540e08539fda0ad40036505af75da7"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>回家之前顺带拍了这张照片：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/e1ebadf380d2a24d768e71530dbfbd5.7w6rgrrov7.jpg" alt="e1ebadf380d2a24d768e71530dbfbd5"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<h1 id="试玩《黑神话·悟空》"><a href="#试玩《黑神话·悟空》" class="headerlink" title="试玩《黑神话·悟空》"></a>试玩《黑神话·悟空》</h1><p>8月20日，黑神话·悟空上线了<br>试玩了一下，不愧是最强3A大作<br>里面的boss和打斗都特别爽，当然难度也特别高就是啦~~<br>可惜我没截图，要不然早就放上去了</p>
+<p>而且因为要开学，我不怎么玩这个游戏了。。。。。。</p>
+<h1 id="回归卡丘世界"><a href="#回归卡丘世界" class="headerlink" title="回归卡丘世界"></a>回归卡丘世界</h1><p>没错，我也玩卡拉彼丘<br>其实在6-7月的时候我就开始玩了<br>后面7月下旬我没怎么玩（原因是匹配率过低），所以没把这件事写在我的文章里面</p>
+<p>直到8月的时候有个电话，是心夏打来的（上次我见到这种打电话的活动还是原的某个活动，当然这个其实是没有打电话给我的啦，我也是通过b站才知道原神很久之前有这个活动）<br>然后才开始回归<br>到现在为止已经半个月过去了，心夏没选过，奥黛丽和反而经常选<br>而且7月那时候经常匹配不到人，这半个月的匹配率反而高得离谱，基本都是秒进</p>
+<p>不说了，还是来看看我这个月收藏的机子吧~~</p>
+<h1 id="收藏的机子"><a href="#收藏的机子" class="headerlink" title="收藏的机子"></a>收藏的机子</h1><h2 id="第一台真正收藏的塞班S60V3的机子-——-诺基亚5320"><a href="#第一台真正收藏的塞班S60V3的机子-——-诺基亚5320" class="headerlink" title="第一台真正收藏的塞班S60V3的机子 —— 诺基亚5320"></a>第一台真正收藏的塞班S60V3的机子 —— 诺基亚5320</h2><p>收到这机子之后我就给这台机子的证书给破解了<br>并且整了个花海咲季（学园偶像大师）的主题和换成Fighting My Way铃声，顺带给字体也换了<br>我原本有在里面装了个Bounce Tales和哆啦A梦·海盗岛大冒险的，但是因为内存卡我误删东西导致这两个的数据丢失了。。。。。。。<br>而且这台机子玩bounce tales跳进水坑（尤其是bumpy那关）会特别卡，估计是因为配置的原因<br>算了先这样吧，上图片~~（成色不好请见谅）<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/bcdaa1067b22ec5261ad87374105b31.6t72601lfc.jpg" alt="bcdaa1067b22ec5261ad87374105b31"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/c2a64212ce7294844551e1a84f809ba.231t7la2of.jpg" alt="c2a64212ce7294844551e1a84f809ba"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/0d3697725b8467faab3c008be630d82.8s38wc84xh.jpg" alt="0d3697725b8467faab3c008be630d82"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/31566ce0f1217dae45abd985c1a3198.4xuhddpchi.jpg" alt="31566ce0f1217dae45abd985c1a3198"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p>说了那么多，那有没有一台能流畅玩java游戏的S60V3的机子呢？<br>诶~~我还真有<br>那就……</p>
+<h2 id="真神降临-——-诺基亚5730xm"><a href="#真神降临-——-诺基亚5730xm" class="headerlink" title="真神降临 —— 诺基亚5730xm"></a>真神降临 —— 诺基亚5730xm</h2><p>跟那5320一样，也是先给系统破解证书然后换主题和铃声，并且给字体换了<br>不过这次我给这台的主题换的是蔚蓝档案里面的桐生桔梗，这机子的配色刚好也适合桔梗的头发配色<br>（别问为啥没有和纱，肥猫的话得等我有收藏5630再来搞）<br>然而铃声不是桐生桔梗ai翻唱的歌曲，反而换成了灰澈和另外一位大佬创作的歌曲 —— 《桔梗》<br>这机子的配色搭配这个铃声简直绝了<br>上图片~~<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/b97b2a1f31b3bbec55478dba3d50386.86tla1xilo.jpg" alt="b97b2a1f31b3bbec55478dba3d50386"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/1bcb6e6af2ed9ce3fae9830325c52b0.7ljxnr35ds.jpg" alt="1bcb6e6af2ed9ce3fae9830325c52b0"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/42bf9b13dfee4be45e2c203864991e9.7w6rgwihwe.jpg" alt="42bf9b13dfee4be45e2c203864991e9"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/cd72da20a87ac2c74312dc48be6013c.92q2pi7ckj.jpg" alt="cd72da20a87ac2c74312dc48be6013c"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/854d8b51690c52a08e64dc962079b65.969on80im8.jpg" alt="854d8b51690c52a08e64dc962079b65"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<h2 id="白银级稀有机子-——-三星L228"><a href="#白银级稀有机子-——-三星L228" class="headerlink" title="白银级稀有机子 —— 三星L228"></a>白银级稀有机子 —— 三星L228</h2><p>这机子算是奥运稀有机子里面的白银款<br>别问为啥，黄鱼上有成色比这台机子更精美的外观<br>算了不多说。放图~~~<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/4f7b343bc99855058778c3aeecd7448.pfa3ku95v.jpg" alt="4f7b343bc99855058778c3aeecd7448"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/5001dec598a5c09e28e5c5e01e711f3.77dhww5a5g.jpg" alt="5001dec598a5c09e28e5c5e01e711f3"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/bbf0958f0282da6b7d93ec387504a10.45mh9zvyk.jpg" alt="bbf0958f0282da6b7d93ec387504a10"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<h2 id="钻石级稀有Linux机子-——-三星i839-三星i859"><a href="#钻石级稀有Linux机子-——-三星i839-三星i859" class="headerlink" title="钻石级稀有Linux机子 —— 三星i839/三星i859"></a>钻石级稀有Linux机子 —— 三星i839/三星i859</h2><p>据说是稀有的搭载Mizi Linux的机子<br>而三星搭载Mizi Linux的机子只发布了四款（都是针对国内的）：<br>i858、i819、i839和i859<br>而黄鱼上最后的i839和i859被我拿下了，就剩下不知道能不能开机的i819和特别贵的i858<br>算了不多说，放图：</p>
+<p>首先是i839（懒得设置时间了，这样看吧。。。。）<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/3d0cf11588986baf02e690194fa8da5.6f0mf5wnlv.jpg" alt="3d0cf11588986baf02e690194fa8da5"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/2eaf3edb9cbd91e166e0d67c04ac4ef.5xakqkv6uz.jpg" alt="2eaf3edb9cbd91e166e0d67c04ac4ef"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/a88d14a1ce98ad250a4cae1a2f596aa.54xp8uepni.jpg" alt="a88d14a1ce98ad250a4cae1a2f596aa"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/59d6d48903b35a0eeec05c2d7246e1a.8s38wdak7q.jpg" alt="59d6d48903b35a0eeec05c2d7246e1a"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/fb088100a0c7e6232cdf6194e370404.9nzqbtkat5.jpg" alt="fb088100a0c7e6232cdf6194e370404"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p>然后就是i859<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/be7ffc552658474863392b12fd26da0.2yyan49kh4.jpg" alt="be7ffc552658474863392b12fd26da0"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/796e29b843af4ea7050621e70139e21.13lpuhx5wr.jpg" alt="796e29b843af4ea7050621e70139e21"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/299da0a2df6c8b7621904e60c42f9b2.1lbrj2ynkh.jpg" alt="299da0a2df6c8b7621904e60c42f9b2"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/89f89fd776f9d6e6e5ec92b3dbcbd99.7egpsdm5a5.jpg" alt="89f89fd776f9d6e6e5ec92b3dbcbd99"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p>然而这些为啥才算钻石级别呢，因为还有高手！</p>
+<h2 id="皇冠级稀有机子-——-诺基亚X3-01"><a href="#皇冠级稀有机子-——-诺基亚X3-01" class="headerlink" title="皇冠级稀有机子 —— 诺基亚X3-01"></a>皇冠级稀有机子 —— 诺基亚X3-01</h2><p>别问这台为啥称之为皇冠级别呢？因为这台根本就没有真正意义上的发售过！<br>而且虽然只是brew的机子，但是因为是稀有机子，就算是brew也值了！<br>不多说，放图！<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/a10094e6a06250f3d92c36da4486e65.7ax3uny6dr.jpg" alt="a10094e6a06250f3d92c36da4486e65"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/78d009edcf8931da871fa1b92371acb.3uus2kokpr.jpg" alt="78d009edcf8931da871fa1b92371acb"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/1a3db58061f3e020d1ff94a81a65242.4917tfwx1w.jpg" alt="1a3db58061f3e020d1ff94a81a65242"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/ec6b46a5bd1d8a91cdefd99482223a2.3k7y9f9fjm.jpg" alt="ec6b46a5bd1d8a91cdefd99482223a2"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240901/e92bf7b365ca318da8a8efb0e860f21.92q2pkhori.jpg" alt="e92bf7b365ca318da8a8efb0e860f21"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p>以上（我得去睡觉了，要不然明天开学要迟到了。。。。。）</p>
+]]></content>
+      <categories>
+        <category>个人小记</category>
+      </categories>
+      <tags>
+        <tag>个人小记</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>2024-09小记</title>
+    <url>/posts/64856/</url>
+    <content><![CDATA[<p>首先提前祝大家国庆节快乐！<br>然后就是，正片开始！<br>（别问为啥没有收藏手机的环节了，因为开学了所以我就不打算收藏老手机了，要不然我早就收台i819来玩玩了QWQ）</p>
+<h1 id="突如其来的好消息"><a href="#突如其来的好消息" class="headerlink" title="突如其来的好消息"></a>突如其来的好消息</h1><p>很好，月考数学发挥超常<br>满分120我考了90分<br>（别问为啥我这么骄傲，我之前的数学成绩保底是60分）<br>然后就没然后了</p>
+<h1 id="回归邦邦（BanG-Dream）和pjsk（世界计划-缤纷舞台）"><a href="#回归邦邦（BanG-Dream）和pjsk（世界计划-缤纷舞台）" class="headerlink" title="回归邦邦（BanG Dream）和pjsk（世界计划 缤纷舞台）"></a>回归邦邦（BanG Dream）和pjsk（世界计划 缤纷舞台）</h1><p>之前因为某些原因，我把BanG Dream!和pjsk卸了<br>后面因为了解到MyGO!!!!!<psw>（还在go，还在go）</psw>也是属于邦的，因此我回归了邦<br>同时也了解到了pjsk台服换新ui了，所以我顺便回归pjsk了</p>
+<p>然而现在，Craft Egg已经离开邦邦了（听人说似了，但又没似，因为Craft Egg的原社长创立了FromTokyo，并且加入参与制作BanG Dream!<psw>，本质上没变只是Craft Egg换了层皮</psw>）<br>而pjsk新UI的也到来了（之前台服pjsk还是老ui的时候有幸入坑了日服，对我来说没有影响到我的手感就行了。。。。。。）</p>
+<h1 id="回归Memos"><a href="#回归Memos" class="headerlink" title="回归Memos"></a>回归Memos</h1><p>之前从7iNet那边买了台机子<br>我想要部署点啥，就给Memos搞了<br>（毕竟我之前加入过<a href="https://memobbs.app/">木木大佬的哔哔广场</a>啦，这个是重新回归）</p>
+<p>7iNat那边因为HK-NAT区域稳定性改造，我的Memos目前没法访问<br>因此没法把链接放上去了。。。。。<br>等什么时候好了我就放链接吧。。。。。。。</p>
+]]></content>
+      <categories>
+        <category>个人小记</category>
+      </categories>
+      <tags>
+        <tag>个人小记</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>GameLoad</title>
+    <url>/posts/21375/</url>
+    <content><![CDATA[<h1 id="前言"><a href="#前言" class="headerlink" title="前言"></a>前言</h1><p>自从在我的360极速浏览器安装FVD Downloader这个插件后，我就习惯将4399上的swf下载下来了<br>后面我在玩4399上的U3D游戏（得安装UnityWebPlayer才能玩）的时候弹出了这个提示：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230404/360chrome_xFZnhVi7dg.1xookg8vju2o.webp" alt="360chrome_xFZnhVi7dg"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>但FVD Downloader能识别到游戏文件<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230404/360chrome_3Yt4q2IsEs.26dp6kmu464g.webp" alt="360chrome_3Yt4q2IsEs"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>于是我将后缀为“unity3d”的游戏下载下来，打算找个游戏启动器来启动这个游戏<br>找了一圈找到了这玩意：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230404/msedge_ZV2ru5IQh0.48zi2sq5i620.webp" alt="msedge_ZV2ru5IQh0"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p>这个软件安装完成之后，会自动关联后缀为“unity3d”的文件<br>经测试，能顺利游玩大部分u3d游戏</p>
+<h1 id="示例"><a href="#示例" class="headerlink" title="示例"></a>示例</h1><p>1.<a href="http://www.4399.com/flash/147405.htm">杀手小乔3D</a><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230404/GameLoad_WN1oQsK9Bq.3quhllbtc540.webp" alt="GameLoad_WN1oQsK9Bq"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230404/GameLoad_bHycAxI9Xi.yj0xvg4dork.webp" alt="GameLoad_bHycAxI9Xi"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>2.<a href="https://www.4399.com/flash/191954.htm">优米酱GO</a><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230404/GameLoad_PDftUq8rZR.4ofq40gtb3e0.webp" alt="GameLoad_PDftUq8rZR"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230404/image.12alzy49ndyo.webp" alt="image"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230404/GameLoad_W0oG3jH9c9.llzawzb03ts.webp" alt="GameLoad_W0oG3jH9c9"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>3.<a href="http://www.4399.com/flash/151847.htm">追逐繁星的孩子（追逐繁星的夏娜）</a><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230404/GameLoad_ZKdZV5gYnn.214xzg7lessg.webp" alt="GameLoad_ZKdZV5gYnn"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230404/GameLoad_25LfvnlHtf.1uq8qqsy49s0.webp" alt="GameLoad_25LfvnlHtf"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230404/GameLoad_YH7ebdiJqU.hjnvf80xo6o.webp" alt="GameLoad_YH7ebdiJqU"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>后面看了第三个游戏的一个评论才知道这个角色叫Unity娘（Unity Chan），而且这模型还是免费的<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230404/msedge_5G6QZ3PZVJ.2lzj9irde260.webp" alt="msedge_5G6QZ3PZVJ"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><psw>（怪不得第二个游戏和第三个游戏的主角都是同一个模型。。。。。）</psw></p>
+<h1 id="下载链接"><a href="#下载链接" class="headerlink" title="下载链接"></a>下载链接</h1><p><a href="https://www.gameload.top/">https://www.gameload.top/</a></p>
+<h1 id="后记"><a href="#后记" class="headerlink" title="后记"></a>后记</h1><p>我看了下Gameload的官网，发现这玩意支持JS加载：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230404/msedge_yw02846AU8.5rh04nc4l3s0.webp" alt="msedge_yw02846AU8"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>插件示例我先放上去了，后面我再来搞这玩意吧：<br><figure class="highlight html"><table><tr><td class="code"><pre><span class="line"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js&quot;</span>&gt;</span><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span><br><span class="line"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://cdnjs.cloudflare.com/ajax/libs/jquery-browser/0.0.8/jquery.browser.min.js&quot;</span>&gt;</span><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span><br><span class="line"><span class="tag">&lt;<span class="name">script</span>&gt;</span><span class="language-javascript"></span></span><br><span class="line"><span class="language-javascript">$(<span class="variable language_">document</span>).<span class="title function_">ready</span>(<span class="keyword">function</span>(<span class="params"></span>)&#123;</span></span><br><span class="line"><span class="language-javascript">    <span class="keyword">if</span> ($.browser.<span class="property">chrome</span> === <span class="literal">true</span> &amp;&amp; $.browser.<span class="property">versionNumber</span> &gt;= <span class="number">45</span>) &#123; <span class="comment">//detect Chrome 45+</span></span></span><br><span class="line"><span class="language-javascript">        <span class="keyword">var</span> myJsonString = <span class="title class_">JSON</span>.<span class="title function_">stringify</span>(&#123; <span class="attr">title</span>: <span class="string">&#x27;游戏标题&#x27;</span>, <span class="attr">file</span>: <span class="string">&#x27;游戏链接&#x27;</span>, <span class="attr">type</span>: <span class="string">&quot;unity&quot;</span>, <span class="attr">width</span>: <span class="number">800</span>, <span class="attr">height</span>: <span class="number">600</span> &#125;);</span></span><br><span class="line"><span class="language-javascript">        <span class="keyword">try</span>&#123; <span class="comment">//IE8 does not support window.btoa   </span></span></span><br><span class="line"><span class="language-javascript">            <span class="keyword">var</span> insert_data = <span class="variable language_">window</span>.<span class="title function_">btoa</span>(myJsonString); </span></span><br><span class="line"><span class="language-javascript">        &#125;<span class="keyword">catch</span>(e)&#123; </span></span><br><span class="line"><span class="language-javascript">        <span class="title function_">functionToHandleError</span>(e);</span></span><br><span class="line"><span class="language-javascript">        &#125;</span></span><br><span class="line"><span class="language-javascript">        </span></span><br><span class="line"><span class="language-javascript">        $(<span class="string">&#x27;#unityPlayer .missing&#x27;</span>).<span class="title function_">prepend</span>(<span class="string">&#x27;&lt;center&gt;&lt;a href=&quot;gameload://&#x27;</span> + insert_data + <span class="string">&#x27;/&quot;&gt;&lt;img alt=&quot;Play game with Gameload!&quot; src=&quot;http://data.gameload.top/download/playgameload.png&quot; /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;Install Gameload to play Unity games&lt;br /&gt;&lt;a href=&quot;http://data.gameload.top/download/gameload.exe&quot; title=&quot;Install Gameload now!&quot;&gt;&lt;img alt=&quot;Install Gameload now!&quot; src=&quot;http://data.gameload.top/download/getgameload.png&quot; /&gt;&lt;/a&gt;&lt;/center&gt;&#x27;</span>);</span></span><br><span class="line"><span class="language-javascript">    &#125;</span></span><br><span class="line"><span class="language-javascript">&#125;);</span></span><br><span class="line"><span class="language-javascript"></span><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span><br><span class="line"><span class="tag">&lt;<span class="name">div</span> <span class="attr">id</span>=<span class="string">&quot;unityPlayer&quot;</span>&gt;</span></span><br><span class="line">    <span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&quot;missing&quot;</span>&gt;</span><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span><br><span class="line"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span><br></pre></td></tr></table></figure></p>
+]]></content>
+      <categories>
+        <category>游戏相关</category>
+      </categories>
+      <tags>
+        <tag>游戏相关</tag>
+        <tag>其它游戏</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>Gameload示例</title>
+    <url>/posts/20412/</url>
+    <content><![CDATA[<h2 id="安装GameLoad"><a href="#安装GameLoad" class="headerlink" title="安装GameLoad"></a>安装GameLoad</h2>
+<a href="https://files.blog.sinzmise.top/unity3d/gameload.exe" class="css-button post-button-gameload"><i class="fa-solid fa-arrows-rotate"></i>&nbsp;&nbsp;安装GameLoad</a>
+
+<h2 id="游戏示例——优米酱GO"><a href="#游戏示例——优米酱GO" class="headerlink" title="游戏示例——优米酱GO"></a>游戏示例——优米酱GO</h2><p>点击游玩：<br>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-browser/0.0.8/jquery.browser.min.js"></script>
+<script>
+$(document).ready(function(){
+    if ($.browser.chrome === true && $.browser.versionNumber >= 45) { //detect Chrome 45+
+        var myJsonString = JSON.stringify({ title: 'Game Title', file: 'https://files.blog.sinzmise.top/unity3d/yumichan.unity3d', type: "unity", width: 800, height: 600 });
+        try{ //IE8 does not support window.btoa   
+            var insert_data = window.btoa(myJsonString); 
+        }catch(e){ 
+        functionToHandleError(e);
+        }
+
+        $('#unityPlayer-yumichan').prepend('<a href="gameload://' + insert_data + '/" class="css-button post-button-gameload"><i class="fa-solid fa-arrows-rotate"></i>&nbsp;&nbsp;使用GameLoad游玩</a>');
+    }
+});
+</script>
+<div id="unityPlayer-yumichan"></div>
+<br>源码示例<br><figure class="highlight html"><table><tr><td class="code"><pre><span class="line"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://cdnjs.cloudflare.com/ajax/libs/jquery-browser/0.0.8/jquery.browser.min.js&quot;</span>&gt;</span><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span><br><span class="line"><span class="tag">&lt;<span class="name">script</span>&gt;</span><span class="language-javascript"></span></span><br><span class="line"><span class="language-javascript">$(<span class="variable language_">document</span>).<span class="title function_">ready</span>(<span class="keyword">function</span>(<span class="params"></span>)&#123;</span></span><br><span class="line"><span class="language-javascript">    <span class="keyword">if</span> ($.browser.<span class="property">chrome</span> === <span class="literal">true</span> &amp;&amp; $.browser.<span class="property">versionNumber</span> &gt;= <span class="number">45</span>) &#123; <span class="comment">//detect Chrome 45+</span></span></span><br><span class="line"><span class="language-javascript">        <span class="keyword">var</span> myJsonString = <span class="title class_">JSON</span>.<span class="title function_">stringify</span>(&#123; <span class="attr">title</span>: <span class="string">&#x27;Game Title&#x27;</span>, <span class="attr">file</span>: <span class="string">&#x27;https://files.blog.sinzmise.top/unity3d/yumichan.unity3d&#x27;</span>, <span class="attr">type</span>: <span class="string">&quot;unity&quot;</span>, <span class="attr">width</span>: <span class="number">800</span>, <span class="attr">height</span>: <span class="number">600</span> &#125;);</span></span><br><span class="line"><span class="language-javascript">        <span class="keyword">try</span>&#123; <span class="comment">//IE8 does not support window.btoa   </span></span></span><br><span class="line"><span class="language-javascript">            <span class="keyword">var</span> insert_data = <span class="variable language_">window</span>.<span class="title function_">btoa</span>(myJsonString); </span></span><br><span class="line"><span class="language-javascript">        &#125;<span class="keyword">catch</span>(e)&#123; </span></span><br><span class="line"><span class="language-javascript">        <span class="title function_">functionToHandleError</span>(e);</span></span><br><span class="line"><span class="language-javascript">        &#125;</span></span><br><span class="line"><span class="language-javascript"></span></span><br><span class="line"><span class="language-javascript">        $(<span class="string">&#x27;#unityPlayer-yumichan&#x27;</span>).<span class="title function_">prepend</span>(<span class="string">&#x27;&lt;a href=&quot;gameload://&#x27;</span> + insert_data + <span class="string">&#x27;/&quot; class=&quot;css-button post-button-gameload&quot;&gt;&lt;i class=&quot;fa-solid fa-arrows-rotate&quot;&gt;&lt;/i&gt;&amp;nbsp;&amp;nbsp;使用GameLoad游玩&lt;/a&gt;&#x27;</span>);</span></span><br><span class="line"><span class="language-javascript">    &#125;</span></span><br><span class="line"><span class="language-javascript">&#125;);</span></span><br><span class="line"><span class="language-javascript"></span><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span><br><span class="line"><span class="tag">&lt;<span class="name">div</span> <span class="attr">id</span>=<span class="string">&quot;unityPlayer-yumichan&quot;</span>&gt;</span><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span><br></pre></td></tr></table></figure></p>
+]]></content>
+      <categories>
+        <category>项目折腾</category>
+      </categories>
+      <tags>
+        <tag>项目折腾</tag>
+        <tag>Windows软件</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>再见2022，你好2023</title>
+    <url>/posts/23021/</url>
+    <content><![CDATA[<div class="trm-note info"><div class="trm-note-title">INFO</div><p>封面图片来自：<a href="https://www.tukuppt.com/muban/vnjzjzvp.html">https://www.tukuppt.com/muban/vnjzjzvp.html</a></p>
+</div>
+<p>这是我在2022年的最后一篇文章。<br>时间过得真快，我刚迁移完博客，2022就快结束了<br>对此我并没有想说的 <del>（不是懒得说是真的没灵感）</del><br>不知道要说什么，也不知道有什么话要跟大家说<br>那我就先祝大家新的一年开开心心吧！<br>再见，2022。你好2023。</p>
+]]></content>
+      <categories>
+        <category>个人小记</category>
+      </categories>
+      <tags>
+        <tag>个人小记</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>记一次部署Memos</title>
+    <url>/posts/18063/</url>
+    <content><![CDATA[<h1 id="前言"><a href="#前言" class="headerlink" title="前言"></a>前言</h1><p>ispeak的编辑器用的jsdelivr，这导致了每次我要新建日记的时候编辑器没显示，被迫换方案<br>经过<a href="https://immmmm.com/hi-memos/">木木</a>大佬的介绍，我找到了一个叫Memos的知识库<br>但我没钱买服务器部署，于是就考虑无服务器部署</p>
+<h1 id="Render部署"><a href="#Render部署" class="headerlink" title="Render部署"></a>Render部署</h1><p>我首先考虑的是Render部署，因为Render能部署“Web Server”<br>但部署完成没几个小时后，我发布的日记消失了<br>看了一下，Render没有访问就会清理数据并且重新部署<br>考虑到这个是用来做日记用的，数据很重要，因此，我放弃了Render</p>
+<h1 id="Zeabur部署"><a href="#Zeabur部署" class="headerlink" title="Zeabur部署"></a>Zeabur部署</h1><p>Zeabur部署Memos很方便，自带的Marketplace就有Memos<br>但由于Zeabur现在只能免费7天，过期之前需要登陆上去手动续期<br>再加上Zeabur自带的Marketplace要收费<br>因此，我放弃了Zeabur部署</p>
+<h1 id="Replit部署"><a href="#Replit部署" class="headerlink" title="Replit部署"></a>Replit部署</h1><p>我找的很多Replit部署Memos的教程都不是最新版本的Memos<br>看了一下教程，发现那些教程大多都是自己构建后端的<br>那么我就在想：能否用Github Action部署最新版本Memos后端呢？<br>于是搞了很久，经历了许多次失败，终于构建成功！<br>然后用构建完成的Memos试运行，结果显示“No frontend embeded.”<br>查issues，才知道原来得部署前端<br>问题不大！将部署前端的命令写在update.yml里面<br>第二次试运行，成功！<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230801/AP7iMWt7QU.6stfiu4ghlk0.png" alt="AP7iMWt7QU"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><psw>（别问为啥没有第一次试运行的图。。。。。。忘记截图了）</psw><br>感兴趣的话可以看一下我的项目：<a href="https://github.com/SinzMise/memos-on-replit">https://github.com/SinzMise/memos-on-replit</a></p>
+<h1 id="Koyeb部署"><a href="#Koyeb部署" class="headerlink" title="Koyeb部署"></a>Koyeb部署</h1><p>最近听安小歪说Replit要收费了<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/QQ_EqAgdYlEts.png" alt=""  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>他的Memos转到了codesandbox，我的也转过去了<br>但我们发现codesandbox会休眠，不得不换个部署平台<br>之后我发现Memos能连Mysql或者postgreSQL数据库，于是我决定换koyeb部署<br>注册koyeb账号必须开t才没有银行卡验证的选项<br>然后再新建个Web Service<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/msedge_Kd4LmCDhpM.png" alt=""  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>选择docker<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/msedge_rAnK6dlRB5.png" alt=""  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>在image这一行填写：<code>ghcr.io/usememos/memos:latest</code>，点击Next<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/msedge_3pmSNqxnlH.png" alt=""  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>划到下面，点击Advanced，Environment variables新增两个变量：<code>MEMOS_DRIVER</code>和<code>MEMOS_DSN</code></p>
+<div class="trm-note warning"><div class="trm-note-title">WARNING</div><p>注意：两个变量都是必选的，当然你也可以不用添加这两个，只不过一旦Memos更新数据会丢失！</p>
+</div>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/msedge_3jo6namzf5.png" alt=""  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>| 变量      | 值 |<br>| —————- | —————- |<br>|MEMOS_DRIVER|数据库名称，MySQL就填<code>mysql</code>，postgreSQL就填<code>postgres</code>|<br>|MEMOS_DSN|数据库地址|</p>
+<div class="trm-note info"><div class="trm-note-title">INFO</div><p>值得一提的是，你使用postgreSQL的时候，数据库地址必须要添加前面的<code>postgresql://</code><br>也就是下面的例子：<br><figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line">postgresql://postgres:PASSWORD@localhost:5432/memos</span><br></pre></td></tr></table></figure><br>mysql不用在前面加<code>mysql://</code><br>直接按照下面的例子填写就行（注意括号和前面的tcp要去掉！）<br><figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line">root:password@tcp(localhost)/memos_prod</span><br><span class="line"></span><br></pre></td></tr></table></figure></p>
+</div>
+<p>然后将Exposing your service下面的port改为5432，然后deploy<br>等一会你就能体验到Memos了</p>
+<div class="trm-note info"><div class="trm-note-title">INFO</div><p>但koyeb绑定域名好像要钱，因此最好再注册个koyeb账号来搞Uptime Kuma ，然后监测源站（这样的话可以确保反代的时候源站不会没）</p>
+</div>
+<h1 id="Serv00部署"><a href="#Serv00部署" class="headerlink" title="Serv00部署"></a>Serv00部署</h1><p>由于Koyeb的部署会自动休眠，因此不得不找别的部署方式</p>
+<p>因为之前看见了Serv00部署Alist的方式，所以我寻思着用serv00的方法部署memos<br>但是苦于不知道前端文件夹放到哪里，因此只能搁置了<br>然后那个博主就补充了一个serv00部署Memos的教程<br>教程我放这里了（主要是我懒得搬过来）：<br><div class="tag link"><a class="link_card" referrerPolicy="no-referrer" title="Serv00部署Memos" href="https://blog.rappit.site/2024/01/27/serv00_logs/#Memos"><div class="link_icon"><svg t="1670307855063" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="19066" width="200" height="200"><path d="M504.064 516.608m-384.256 0a384.256 384.256 0 1 0 768.512 0 384.256 384.256 0 1 0-768.512 0Z" fill="#009CF5" p-id="19068"></path><path d="M746.112 270.464L472.448 485.12l63.104 63.104L750.08 274.56c2.304-2.688-1.28-6.144-3.968-4.096z" fill="#FF4C3A" p-id="19069"></path><path d="M262.016 762.752l273.664-214.528-63.104-63.104-214.656 273.536c-2.176 2.688 1.28 6.144 4.096 4.096z" fill="#FFFFFF" p-id="19070"></path><path d="M505.216 155.136c-3.2 0-5.888 2.56-5.888 5.888v53.504c0 3.2 2.56 5.888 5.888 5.888s5.888-2.56 5.888-5.888v-53.504c-0.128-3.2-2.688-5.888-5.888-5.888zM442.368 160.512c-3.2 0.512-5.376 3.584-4.736 6.784l9.344 52.736c0.512 3.2 3.584 5.376 6.784 4.736 3.2-0.512 5.376-3.584 4.736-6.784l-9.344-52.736c-0.512-3.2-3.584-5.376-6.784-4.736zM396.288 234.368c1.152 3.072 4.48 4.608 7.552 3.456 3.072-1.152 4.608-4.48 3.456-7.552l-18.304-50.304c-1.152-3.072-4.48-4.608-7.552-3.456-3.072 1.152-4.608 4.48-3.456 7.552l18.304 50.304zM348.928 257.408c1.664 2.816 5.248 3.712 7.936 2.176s3.712-5.248 2.176-7.936l-26.752-46.336c-1.664-2.816-5.248-3.712-7.936-2.176-2.816 1.664-3.712 5.248-2.176 7.936l26.752 46.336zM306.304 288.256c2.048 2.432 5.76 2.816 8.192 0.768 2.432-2.048 2.816-5.76 0.768-8.192l-34.432-40.96c-2.048-2.432-5.76-2.816-8.192-0.768-2.432 2.048-2.816 5.76-0.768 8.192l34.432 40.96zM269.696 326.144c2.432 2.048 6.144 1.792 8.192-0.768 2.048-2.432 1.792-6.144-0.768-8.192l-40.96-34.432c-2.432-2.048-6.144-1.792-8.192 0.768-2.048 2.432-1.792 6.144 0.768 8.192l40.96 34.432zM193.792 342.912l46.336 26.752c2.816 1.664 6.4 0.64 7.936-2.176 1.664-2.816 0.64-6.4-2.176-8.064L199.552 332.8c-2.816-1.664-6.4-0.64-7.936 2.176-1.664 2.688-0.64 6.272 2.176 7.936zM168.32 399.488l50.304 18.304c3.072 1.152 6.4-0.512 7.552-3.456 1.152-3.072-0.512-6.4-3.456-7.552l-50.304-18.304c-3.072-1.152-6.4 0.512-7.552 3.456-1.152 3.072 0.384 6.4 3.456 7.552zM207.872 457.344l-52.736-9.344c-3.2-0.512-6.272 1.536-6.784 4.736-0.512 3.2 1.536 6.272 4.736 6.784l52.736 9.344c3.2 0.512 6.272-1.536 6.784-4.736 0.512-3.2-1.536-6.272-4.736-6.784zM201.984 509.568H148.48c-3.2 0-5.888 2.56-5.888 5.888 0 3.2 2.56 5.888 5.888 5.888h53.504c3.2 0 5.888-2.56 5.888-5.888 0-3.2-2.56-5.888-5.888-5.888zM205.44 562.176l-52.736 9.344c-3.2 0.512-5.376 3.584-4.736 6.784 0.512 3.2 3.584 5.376 6.784 4.736l52.736-9.344c3.2-0.512 5.376-3.584 4.736-6.784s-3.584-5.248-6.784-4.736zM217.856 613.376l-50.304 18.304c-3.072 1.152-4.608 4.48-3.456 7.552 1.152 3.072 4.48 4.608 7.552 3.456l50.304-18.304c3.072-1.152 4.608-4.48 3.456-7.552-1.152-3.072-4.48-4.608-7.552-3.456zM238.976 661.504l-46.336 26.752c-2.816 1.664-3.712 5.248-2.176 8.064 1.664 2.816 5.248 3.712 8.064 2.176l46.336-26.752c2.816-1.664 3.712-5.248 2.176-8.064-1.664-2.816-5.248-3.712-8.064-2.176zM268.16 705.408l-40.96 34.432c-2.432 2.048-2.816 5.76-0.768 8.192 2.048 2.432 5.76 2.816 8.192 0.768l40.96-34.432c2.432-2.048 2.816-5.76 0.768-8.192-1.92-2.56-5.632-2.816-8.192-0.768zM304.512 743.424l-34.432 40.96c-2.048 2.432-1.792 6.144 0.768 8.192 2.432 2.048 6.144 1.792 8.192-0.768l34.432-40.96c2.048-2.432 1.792-6.144-0.768-8.192-2.304-1.92-6.016-1.664-8.192 0.768zM347.008 774.656l-26.752 46.336c-1.664 2.816-0.64 6.4 2.176 7.936 2.816 1.664 6.4 0.64 8.064-2.176l26.752-46.336c1.664-2.816 0.64-6.4-2.176-7.936-2.816-1.536-6.4-0.64-8.064 2.176zM394.24 798.08l-18.304 50.304c-1.152 3.072 0.512 6.4 3.456 7.552 3.072 1.152 6.4-0.512 7.552-3.456l18.304-50.304c1.152-3.072-0.512-6.4-3.456-7.552-3.072-1.152-6.528 0.384-7.552 3.456zM440.192 872.32c3.2 0.512 6.272-1.536 6.784-4.736l9.344-52.736c0.512-3.2-1.536-6.272-4.736-6.784-3.2-0.512-6.272 1.536-6.784 4.736l-9.344 52.736c-0.64 3.2 1.536 6.272 4.736 6.784zM502.912 878.08c3.2 0 5.888-2.56 5.888-5.888v-53.504c0-3.2-2.56-5.888-5.888-5.888-3.2 0-5.888 2.56-5.888 5.888v53.504c0 3.2 2.688 5.888 5.888 5.888zM549.632 815.232l9.344 52.736c0.512 3.2 3.584 5.376 6.784 4.736 3.2-0.512 5.376-3.584 4.736-6.784l-9.344-52.736c-0.512-3.2-3.584-5.376-6.784-4.736-3.2 0.512-5.248 3.584-4.736 6.784zM600.832 802.816l18.304 50.304c1.152 3.072 4.48 4.608 7.552 3.456 3.072-1.152 4.608-4.48 3.456-7.552L611.84 798.72c-1.152-3.072-4.48-4.608-7.552-3.456-3.072 1.152-4.608 4.48-3.456 7.552zM649.088 781.696l26.752 46.336c1.664 2.816 5.248 3.712 8.064 2.176 2.816-1.664 3.712-5.248 2.176-8.064l-26.88-46.336c-1.664-2.816-5.248-3.712-8.064-2.176-2.816 1.664-3.712 5.248-2.048 8.064zM692.864 752.384l34.432 40.96c2.048 2.432 5.76 2.816 8.192 0.768 2.432-2.048 2.816-5.76 0.768-8.192l-34.432-40.96c-2.048-2.432-5.76-2.816-8.192-0.768-2.56 2.048-2.816 5.76-0.768 8.192zM730.88 716.032l40.96 34.432c2.432 2.048 6.144 1.792 8.192-0.768 2.048-2.432 1.792-6.144-0.768-8.192l-40.96-34.432c-2.432-2.048-6.144-1.792-8.192 0.768-1.92 2.432-1.664 6.144 0.768 8.192zM762.112 673.664l46.336 26.752c2.816 1.664 6.4 0.64 8.064-2.176 1.664-2.816 0.64-6.4-2.176-7.936L768 663.552c-2.816-1.664-6.4-0.64-8.064 2.176-1.536 2.688-0.64 6.272 2.176 7.936zM785.536 626.432l50.304 18.304c3.072 1.152 6.4-0.512 7.552-3.456 1.152-3.072-0.512-6.4-3.456-7.552l-50.304-18.304c-3.072-1.152-6.4 0.512-7.552 3.456-1.152 3.072 0.384 6.4 3.456 7.552zM800.256 575.872l52.736 9.344c3.2 0.512 6.272-1.536 6.784-4.736 0.512-3.2-1.536-6.272-4.736-6.784l-52.736-9.344c-3.2-0.512-6.272 1.536-6.784 4.736-0.512 3.2 1.536 6.272 4.736 6.784zM800.256 517.76c0 3.2 2.56 5.888 5.888 5.888h53.504c3.2 0 5.888-2.56 5.888-5.888 0-3.2-2.56-5.888-5.888-5.888h-53.504c-3.328 0-5.888 2.56-5.888 5.888zM802.688 471.04l52.736-9.344c3.2-0.512 5.376-3.584 4.736-6.784-0.512-3.2-3.584-5.376-6.784-4.736l-52.736 9.344c-3.2 0.512-5.376 3.584-4.736 6.784 0.512 3.2 3.584 5.248 6.784 4.736zM790.272 419.84l50.304-18.304c3.072-1.152 4.608-4.48 3.456-7.552-1.152-3.072-4.48-4.608-7.552-3.456l-50.304 18.304c-3.072 1.152-4.608 4.48-3.456 7.552 1.152 2.944 4.48 4.608 7.552 3.456zM769.152 371.584l46.336-26.752c2.816-1.664 3.712-5.248 2.176-7.936-1.664-2.816-5.248-3.712-8.064-2.176l-46.336 26.752c-2.816 1.664-3.712 5.248-2.176 8.064 1.664 2.688 5.248 3.712 8.064 2.048zM739.84 327.808l40.96-34.432c2.432-2.048 2.816-5.76 0.768-8.192-2.048-2.432-5.76-2.816-8.192-0.768l-40.96 34.432c-2.432 2.048-2.816 5.76-0.768 8.192 2.048 2.56 5.76 2.816 8.192 0.768zM703.488 289.664l34.432-40.96c2.048-2.432 1.792-6.144-0.768-8.192-2.432-2.048-6.144-1.792-8.192 0.768l-34.432 40.96c-2.048 2.432-1.792 6.144 0.768 8.192 2.432 2.048 6.144 1.792 8.192-0.768zM661.12 258.56l26.752-46.336c1.664-2.816 0.64-6.4-2.176-7.936-2.816-1.664-6.4-0.64-8.064 2.176l-26.752 46.336c-1.664 2.816-0.64 6.4 2.176 7.936 2.816 1.536 6.4 0.64 8.064-2.176zM613.888 235.136l18.304-50.304c1.152-3.072-0.512-6.4-3.456-7.552-3.072-1.152-6.4 0.512-7.552 3.456L602.88 231.168c-1.152 3.072 0.512 6.4 3.456 7.552 3.072 1.024 6.4-0.512 7.552-3.584zM556.544 225.152c3.2 0.512 6.272-1.536 6.784-4.736l9.344-52.736c0.512-3.2-1.536-6.272-4.736-6.784-3.2-0.512-6.272 1.536-6.784 4.736l-9.344 52.736c-0.512 3.2 1.536 6.144 4.736 6.784zM273.536 290.432c2.432 2.432 6.528 2.432 8.96 0 2.432-2.432 2.432-6.528 0-8.96l-21.12-21.12c-2.432-2.432-6.528-2.432-8.96 0-2.432 2.432-2.432 6.528 0 8.96l21.12 21.12zM237.824 333.824c2.944 2.048 6.912 1.28 8.832-1.536 2.048-2.944 1.28-6.912-1.536-8.832l-24.448-17.152c-2.944-2.048-6.912-1.28-8.832 1.536s-1.28 6.912 1.536 8.832l24.448 17.152zM183.04 370.176l27.136 12.672c3.2 1.536 7.04 0.128 8.448-3.072 1.536-3.2 0.128-7.04-3.072-8.448l-27.136-12.672c-3.2-1.536-7.04-0.128-8.448 3.072-1.536 3.2-0.128 7.04 3.072 8.448zM194.688 423.68l-28.928-7.68c-3.456-0.896-6.912 1.152-7.808 4.48-0.896 3.456 1.152 6.912 4.48 7.808l28.928 7.68c3.456 0.896 6.912-1.152 7.808-4.48 0.896-3.456-1.152-6.912-4.48-7.808zM183.168 478.72l-29.824-2.56c-3.456-0.256-6.656 2.304-6.912 5.76-0.256 3.456 2.304 6.656 5.76 6.912l29.824 2.56c3.456 0.256 6.656-2.304 6.912-5.76 0.384-3.456-2.176-6.528-5.76-6.912zM181.504 535.04l-29.824 2.56c-3.456 0.256-6.144 3.456-5.76 6.912 0.256 3.456 3.456 6.144 6.912 5.76l29.824-2.56c3.456-0.256 6.144-3.456 5.76-6.912-0.256-3.456-3.328-6.016-6.912-5.76zM191.36 590.72l-28.928 7.68c-3.456 0.896-5.376 4.352-4.48 7.808 0.896 3.456 4.352 5.376 7.808 4.48l28.928-7.68c3.456-0.896 5.376-4.352 4.48-7.808-0.896-3.328-4.352-5.376-7.808-4.48zM207.232 644.224l-27.136 12.672c-3.2 1.536-4.608 5.248-3.072 8.448 1.536 3.2 5.248 4.608 8.448 3.072l27.136-12.672c3.2-1.536 4.608-5.248 3.072-8.448-1.408-3.2-5.248-4.48-8.448-3.072zM233.984 693.888l-24.448 17.152c-2.944 2.048-3.584 6.016-1.536 8.832 2.048 2.944 6.016 3.584 8.832 1.536l24.448-17.152c2.944-2.048 3.584-6.016 1.536-8.832-2.048-2.944-6.016-3.584-8.832-1.536zM310.912 775.552L293.76 800c-2.048 2.944-1.28 6.912 1.536 8.832 2.944 2.048 6.912 1.28 8.832-1.536l17.152-24.448c2.048-2.944 1.28-6.912-1.536-8.832-2.816-2.048-6.912-1.408-8.832 1.536zM349.184 840.704c3.2 1.536 7.04 0.128 8.448-3.072l12.672-27.136c1.536-3.2 0.128-7.04-3.072-8.448-3.2-1.536-7.04-0.128-8.448 3.072l-12.672 27.136c-1.408 3.2-0.128 6.912 3.072 8.448zM407.808 862.72c3.456 0.896 6.912-1.152 7.808-4.48l7.68-28.928c0.896-3.456-1.152-6.912-4.48-7.808-3.456-0.896-6.912 1.152-7.808 4.48l-7.68 28.928c-0.896 3.328 1.152 6.912 4.48 7.808zM469.376 874.112c3.456 0.256 6.656-2.304 6.912-5.76l2.56-29.824c0.256-3.456-2.304-6.656-5.76-6.912-3.456-0.256-6.656 2.304-6.912 5.76l-2.56 29.824c-0.256 3.584 2.304 6.656 5.76 6.912zM522.496 839.168l2.56 29.824c0.256 3.456 3.456 6.144 6.912 5.76 3.456-0.256 6.144-3.456 5.76-6.912l-2.56-29.824c-0.256-3.456-3.456-6.144-6.912-5.76-3.456 0.256-6.016 3.328-5.76 6.912zM578.176 830.976l7.68 28.928c0.896 3.456 4.352 5.376 7.808 4.48 3.456-0.896 5.376-4.352 4.48-7.808l-7.68-28.928c-0.896-3.456-4.352-5.376-7.808-4.48-3.328 0.896-5.376 4.48-4.48 7.808zM631.68 813.312l12.672 27.136c1.536 3.2 5.248 4.608 8.448 3.072 3.2-1.536 4.608-5.248 3.072-8.448l-12.672-27.136c-1.536-3.2-5.248-4.608-8.448-3.072-3.2 1.536-4.48 5.248-3.072 8.448zM681.344 786.688l17.152 24.448c2.048 2.944 6.016 3.584 8.832 1.536 2.944-2.048 3.584-6.016 1.536-8.832l-17.152-24.448c-2.048-2.944-6.016-3.584-8.832-1.536-2.944 1.92-3.584 5.888-1.536 8.832zM725.504 751.744l21.12 21.12c2.432 2.432 6.528 2.432 8.96 0 2.432-2.432 2.432-6.528 0-8.96l-21.12-21.12c-2.432-2.432-6.528-2.432-8.96 0-2.432 2.432-2.432 6.528 0 8.96zM763.008 709.76l24.448 17.152c2.944 2.048 6.912 1.28 8.832-1.536 2.048-2.944 1.28-6.912-1.536-8.832l-24.448-17.152c-2.944-2.048-6.912-1.28-8.832 1.536-2.048 2.816-1.408 6.784 1.536 8.832zM792.576 661.888l27.136 12.672c3.2 1.536 7.04 0.128 8.448-3.072 1.536-3.2 0.128-7.04-3.072-8.448l-27.136-12.672c-3.2-1.536-7.04-0.128-8.448 3.072-1.536 3.2-0.128 6.912 3.072 8.448zM813.44 609.536l28.928 7.68c3.456 0.896 6.912-1.152 7.808-4.48 0.896-3.456-1.152-6.912-4.48-7.808l-28.928-7.68c-3.456-0.896-6.912 1.152-7.808 4.48-0.896 3.456 1.024 6.912 4.48 7.808zM824.832 554.368l29.824 2.56c3.456 0.256 6.656-2.304 6.912-5.76 0.256-3.456-2.304-6.656-5.76-6.912l-29.824-2.56c-3.456-0.256-6.656 2.304-6.912 5.76-0.256 3.584 2.304 6.656 5.76 6.912zM826.624 498.176l29.824-2.56c3.456-0.256 6.144-3.456 5.76-6.912-0.256-3.456-3.456-6.144-6.912-5.76l-29.824 2.56c-3.456 0.256-6.144 3.456-5.76 6.912 0.256 3.456 3.328 6.016 6.912 5.76zM818.432 442.368l28.928-7.68c3.456-0.896 5.376-4.352 4.48-7.808-0.896-3.456-4.352-5.376-7.808-4.48l-28.928 7.68c-3.456 0.896-5.376 4.352-4.48 7.808 0.896 3.456 4.48 5.376 7.808 4.48zM800.768 388.992l27.136-12.672c3.2-1.536 4.608-5.248 3.072-8.448-1.536-3.2-5.248-4.608-8.448-3.072l-27.136 12.672c-3.2 1.536-4.608 5.248-3.072 8.448 1.536 3.072 5.248 4.48 8.448 3.072zM774.144 339.328l24.448-17.152c2.944-2.048 3.584-6.016 1.536-8.832-2.048-2.944-6.016-3.584-8.832-1.536L766.848 328.96c-2.944 2.048-3.584 6.016-1.536 8.832 1.92 2.816 5.888 3.584 8.832 1.536zM697.216 257.664l17.152-24.448c2.048-2.944 1.28-6.912-1.536-8.832-2.944-2.048-6.912-1.28-8.832 1.536l-17.152 24.448c-2.048 2.944-1.28 6.912 1.536 8.832 2.816 2.048 6.784 1.408 8.832-1.536zM658.944 192.512c-3.2-1.536-7.04-0.128-8.448 3.072l-12.672 27.136c-1.536 3.2-0.128 7.04 3.072 8.448 3.2 1.536 7.04 0.128 8.448-3.072l12.672-27.136c1.408-3.2 0-7.04-3.072-8.448zM600.192 170.496c-3.456-0.896-6.912 1.152-7.808 4.48l-7.68 28.928c-0.896 3.456 1.152 6.912 4.48 7.808 3.456 0.896 6.912-1.152 7.808-4.48l7.68-28.928c1.024-3.328-1.024-6.912-4.48-7.808zM534.912 201.6c3.456 0.256 6.656-2.304 6.912-5.76l2.56-29.824c0.256-3.456-2.304-6.656-5.76-6.912-3.456-0.256-6.656 2.304-6.912 5.76l-2.56 29.824c-0.256 3.456 2.304 6.528 5.76 6.912zM476.032 158.464c-3.456 0.256-6.144 3.456-5.76 6.912l2.56 29.824c0.256 3.456 3.456 6.144 6.912 5.76 3.456-0.256 6.144-3.456 5.76-6.912l-2.56-29.824c-0.256-3.456-3.328-6.016-6.912-5.76zM422.144 173.312c-0.896-3.456-4.352-5.376-7.808-4.48-3.456 0.896-5.376 4.352-4.48 7.808l7.68 28.928c0.896 3.456 4.352 5.376 7.808 4.48 3.456-0.896 5.376-4.352 4.48-7.808l-7.68-28.928zM376.448 219.776l-12.672-27.136c-1.536-3.2-5.248-4.608-8.448-3.072-3.2 1.536-4.608 5.248-3.072 8.448L364.8 225.28c1.536 3.2 5.248 4.608 8.448 3.072 3.2-1.536 4.608-5.376 3.2-8.576zM316.416 253.824c2.048 2.944 6.016 3.584 8.832 1.536 2.944-2.048 3.584-6.016 1.536-8.832l-17.152-24.448c-2.048-2.944-6.016-3.584-8.832-1.536-2.944 2.048-3.584 6.016-1.536 8.832l17.152 24.448z" fill="#FFFFFF" p-id="19071"></path></svg></div><div class="link_content"><div class="link_title">Serv00部署Memos</div></div></a></div></p>
+]]></content>
+      <categories>
+        <category>站点折腾</category>
+      </categories>
+      <tags>
+        <tag>站点折腾</tag>
+        <tag>自建部署</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>Ruffle测试</title>
+    <url>/posts/57692/</url>
+    <content><![CDATA[<p>这玩意也是很久之前就认识到了<br>我甚至记得我还给这玩意写过Hexo插件<br><del>但后来我给这个插件删了，因为这玩意的配置真的简单</del></p>
+<h1 id="介绍"><a href="#介绍" class="headerlink" title="介绍"></a>介绍</h1><p>随着网页的安全性升级，带有安全漏洞的Flash也逐渐被淘汰，现在的主流浏览器几乎都不支持Flash<br>也因此，很多的站点都已经废弃掉他们的flash了<br>但后面我找到了一款叫Ruffle的工具，这玩意是个全新的开源Flash项目，旨在从本地到网页完全替代老旧的Flash<br>而且不同于带有安全漏洞的Flash，Ruffle采用了高效安全的Rust语言编写，同时完全开源保证了及时修补漏洞</p>
+<p>搞这玩意的很多教程都是得在浏览器安装插件，让用户通过这个插件来实现播放flash<br>但我在Ruffle的官网找到个这玩意：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240525/msedge_3a7lLAiAqh.1ov9jby5xi.webp" alt="官网截图"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>这玩意能通过引入在站点js的方式来让自己的站点再次适配swf</p>
+<p>那就废话不多说，赶紧开始吧！<br><del>（话说好像在2024好像只有我对flash依然这么感兴趣。。。。。。。）</del></p>
+<h1 id="配置Ruffle教程"><a href="#配置Ruffle教程" class="headerlink" title="配置Ruffle教程"></a>配置Ruffle教程</h1><h2 id="基础"><a href="#基础" class="headerlink" title="基础"></a>基础</h2><p>只需要在站点下面引入这行代码就可以了<br><figure class="highlight html"><table><tr><td class="code"><pre><span class="line"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://jsd.onmicrosoft.cn/npm/@ruffle-rs/ruffle&quot;</span>&gt;</span><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span><br></pre></td></tr></table></figure><br>如果你想用swfobject来引入swf的话，还得另外引入这个代码：<br><figure class="highlight html"><table><tr><td class="code"><pre><span class="line"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://jsd.onmicrosoft.cn/gh/swfobject/swfobject@master/swfobject/swfobject.js&quot;</span>&gt;</span><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span><br></pre></td></tr></table></figure><br>之后就可以在站点放置flash动画了！<br>不过估计也有人不知道flash动画怎么放，我这里就写个Demo吧！</p>
+<h1 id="Demo"><a href="#Demo" class="headerlink" title="Demo"></a>Demo</h1><h2 id="1-Flash音乐播放器（没有SWFObject的）"><a href="#1-Flash音乐播放器（没有SWFObject的）" class="headerlink" title="1.Flash音乐播放器（没有SWFObject的）"></a>1.Flash音乐播放器（没有SWFObject的）</h2><p>测试音乐：<a href="https://y.qq.com/n/ryqq/songDetail/00366bJo34aPAd">Rain And Tears (纯音乐) - Pop Mania</a><br>（这首歌是一个虎牙中的一位MC实况主经常用的背景音乐，这位实况主还是我第一位关注的玩MC的实况主，然后我就对这个bgm印象很深）<br><div class="trm-tabs" id="flash音乐播放器demo"><ul class="trm-nav-tabs"><li class="trm-tab active"><button type="button" data-href="#flash音乐播放器demo-1">新浪博客swf音乐播放器</button></li><li class="trm-tab"><button type="button" data-href="#flash音乐播放器demo-2">人人网日志swf音乐播放器</button></li><li class="trm-tab"><button type="button" data-href="#flash音乐播放器demo-3">开心网日志swf音乐播放器</button></li><li class="trm-tab"><button type="button" data-href="#flash音乐播放器demo-4">Demo源码</button></li></ul><div class="trm-tab-contents"><div class="trm-tab-item-content active" id="flash音乐播放器demo-1"><p><div id="sinaplayer"></div></p>
+<p><button id="loadsinaplayer" class="btn-beautify block orange center larger" onclick="loadsinamusic()">点我测试</button></p>
+<script>
+function loadsinamusic() {
+    document.getElementById("sinaplayer").innerHTML='<embed width="238" height="24" name="FlashVars" wmode="opaque" play="true" loop="true" scale="showall" src="https://files.blog.sinzmise.top/swf/sina_music_player.swf" FlashVars="url=https%3A%2F%2Ffiles.blog.sinzmise.top%2Fmp3%2FRainAndTears.mp3" type="application/x-shockwave-flash"></embed>';
+    document.getElementById("loadsinaplayer").style.visibility = 'hidden';
+}
+</script></div><div class="trm-tab-item-content" id="flash音乐播放器demo-2"><p><div id="renrenplayer"></div></p>
+<p><button id="loadrenrenplayer" class="btn-beautify block orange center larger" onclick="loadrenrenmusic()">点我测试</button></p>
+<script>
+function loadrenrenmusic() {
+    document.getElementById("renrenplayer").innerHTML='<embed width="360" height="30" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" allowfullscreen="false" allowscriptaccess="sameDomain" bgcolor="#ffffff" scale="noscale" quality="high" menu="false" loop="false" wmode="transparent" src="https://files.blog.sinzmise.top/swf/renren_music_player.swf?url=https%3A%2F%2Ffiles.blog.sinzmise.top%2Fmp3%2FRainAndTears.mp3&Autoplay=0" />';
+    document.getElementById("loadrenrenplayer").style.visibility = 'hidden';
+}
+</script></div><div class="trm-tab-item-content" id="flash音乐播放器demo-3"><p><div id="kaixinplayer"></div></p>
+<p><button id="loadkaixinplayer" class="btn-beautify block orange center larger" onclick="loadkaixinmusic()">点我测试</button></p>
+<script>
+function loadkaixinmusic() {
+    document.getElementById("kaixinplayer").innerHTML='<embed width="365" height="50" align="middle" flashvars="url=https%3A%2F%2Ffiles.blog.sinzmise.top%2Fmp3%2FRainAndTears.mp3&autoplay=0" src="https://files.blog.sinzmise.top/swf/kaixin_music_player.swf" wmode="transparent" loop="false" menu="false" quality="high" scale="noscale" salign="lt" bgcolor="#ffffff" allowscriptaccess="sameDomain" allowfullscreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"/>';
+    document.getElementById("loadkaixinplayer").style.visibility = 'hidden';
+}
+</script></div><div class="trm-tab-item-content" id="flash音乐播放器demo-4"><p>新浪的<br><figure class="highlight html"><table><tr><td class="code"><pre><span class="line"><span class="tag">&lt;<span class="name">embed</span> <span class="attr">width</span>=<span class="string">&quot;238&quot;</span> <span class="attr">height</span>=<span class="string">&quot;24&quot;</span> <span class="attr">name</span>=<span class="string">&quot;FlashVars&quot;</span> <span class="attr">wmode</span>=<span class="string">&quot;opaque&quot;</span> <span class="attr">play</span>=<span class="string">&quot;true&quot;</span> <span class="attr">loop</span>=<span class="string">&quot;true&quot;</span> <span class="attr">scale</span>=<span class="string">&quot;showall&quot;</span> <span class="attr">src</span>=<span class="string">&quot;https://files.blog.sinzmise.top/swf/sina_music_player.swf&quot;</span> <span class="attr">FlashVars</span>=<span class="string">&quot;url=https%3A%2F%2Ffiles.blog.sinzmise.top%2Fmp3%2FRainAndTears.mp3&quot;</span> <span class="attr">type</span>=<span class="string">&quot;application/x-shockwave-flash&quot;</span>&gt;</span><span class="tag">&lt;/<span class="name">embed</span>&gt;</span></span><br></pre></td></tr></table></figure><br>人人网的<br><figure class="highlight html"><table><tr><td class="code"><pre><span class="line"><span class="tag">&lt;<span class="name">embed</span> <span class="attr">width</span>=<span class="string">&quot;360&quot;</span> <span class="attr">height</span>=<span class="string">&quot;30&quot;</span> <span class="attr">pluginspage</span>=<span class="string">&quot;http://www.macromedia.com/go/getflashplayer&quot;</span> <span class="attr">type</span>=<span class="string">&quot;application/x-shockwave-flash&quot;</span> <span class="attr">allowfullscreen</span>=<span class="string">&quot;false&quot;</span> <span class="attr">allowscriptaccess</span>=<span class="string">&quot;sameDomain&quot;</span> <span class="attr">bgcolor</span>=<span class="string">&quot;#ffffff&quot;</span> <span class="attr">scale</span>=<span class="string">&quot;noscale&quot;</span> <span class="attr">quality</span>=<span class="string">&quot;high&quot;</span> <span class="attr">menu</span>=<span class="string">&quot;false&quot;</span> <span class="attr">loop</span>=<span class="string">&quot;false&quot;</span> <span class="attr">wmode</span>=<span class="string">&quot;transparent&quot;</span> <span class="attr">src</span>=<span class="string">&quot;https://files.blog.sinzmise.top/swf/renren_music_player.swf?url=https%3A%2F%2Ffiles.blog.sinzmise.top%2Fmp3%2FRainAndTears.mp3&amp;Autoplay=0&quot;</span> /&gt;</span></span><br></pre></td></tr></table></figure><br>开心网的<br><figure class="highlight html"><table><tr><td class="code"><pre><span class="line"><span class="tag">&lt;<span class="name">embed</span> <span class="attr">width</span>=<span class="string">&quot;365&quot;</span> <span class="attr">height</span>=<span class="string">&quot;50&quot;</span> <span class="attr">align</span>=<span class="string">&quot;middle&quot;</span> <span class="attr">flashvars</span>=<span class="string">&quot;url=https%3A%2F%2Ffiles.blog.sinzmise.top%2Fmp3%2FRainAndTears.mp3&amp;autoplay=0&quot;</span> <span class="attr">src</span>=<span class="string">&quot;https://files.blog.sinzmise.top/swf/kaixin_music_player.swf&quot;</span> <span class="attr">wmode</span>=<span class="string">&quot;transparent&quot;</span> <span class="attr">loop</span>=<span class="string">&quot;false&quot;</span> <span class="attr">menu</span>=<span class="string">&quot;false&quot;</span> <span class="attr">quality</span>=<span class="string">&quot;high&quot;</span> <span class="attr">scale</span>=<span class="string">&quot;noscale&quot;</span> <span class="attr">salign</span>=<span class="string">&quot;lt&quot;</span> <span class="attr">bgcolor</span>=<span class="string">&quot;#ffffff&quot;</span> <span class="attr">allowscriptaccess</span>=<span class="string">&quot;sameDomain&quot;</span> <span class="attr">allowfullscreen</span>=<span class="string">&quot;false&quot;</span> <span class="attr">type</span>=<span class="string">&quot;application/x-shockwave-flash&quot;</span> <span class="attr">pluginspage</span>=<span class="string">&quot;http://www.macromedia.com/go/getflashplayer&quot;</span>/&gt;</span></span><br></pre></td></tr></table></figure></p></div></div></div></p>
+<p>还没写完，后续再写更多Demo</p>
+]]></content>
+      <categories>
+        <category>站点折腾</category>
+      </categories>
+      <tags>
+        <tag>站点折腾</tag>
+        <tag>Flash相关</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>Vercel部署Umami</title>
+    <url>/posts/28733/</url>
+    <content><![CDATA[<h1 id="前言"><a href="#前言" class="headerlink" title="前言"></a>前言</h1><p>之前我是想参考这个教程来部署：<a href="https://digu.plus/post/8034746f42b3495fbb19926e3fb8ec4f/">https://digu.plus/post/8034746f42b3495fbb19926e3fb8ec4f/</a><br>然而部署过程中翻了车<br>这个教程新版教程（顺便总结一下我翻的车）</p>
+<h1 id="数据库选择"><a href="#数据库选择" class="headerlink" title="数据库选择"></a>数据库选择</h1><p>Umami支持MySQL和PostgreSQL数据库，选择自己喜欢的数据库进行数据初始化即可。下面是几个免费的数据库服务，这里选择的是ElephantSQL，当然，并不限于这些。<br>目前www.jsdelivr.ren免费数据库如下：</p>
+<ul>
+<li>MySQL：<a href="https://freedb.tech/">FREEDB.TECH</a>、<a href="https://www.db4free.net/">db4free</a>、<a href="https://sqlpub.com/">SQLPub</a></li>
+<li>PostgreSQL：<a href="https://www.elephantsql.com/">ElephantSQL</a>、<a href="https://supabase.com/">Supabase</a></li>
+</ul>
+<h1 id="数据库部署"><a href="#数据库部署" class="headerlink" title="数据库部署"></a>数据库部署</h1><div class="trm-note warning"><div class="trm-note-title">WARNING</div><p>目前已知Supabase部署失败原因：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230716/msedge_DL0IGBX6O1.2876ewjv3lz4.webp" alt="msedge_DL0IGBX6O1"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+</div>
+<div class="trm-tabs" id="数据库部署"><ul class="trm-nav-tabs"><li class="trm-tab active"><button type="button" data-href="#数据库部署-1">MySQL</button></li><li class="trm-tab"><button type="button" data-href="#数据库部署-2">PostgreSQL</button></li></ul><div class="trm-tab-contents"><div class="trm-tab-item-content active" id="数据库部署-1"><div class="trm-tabs" id="mysql数据库"><ul class="trm-nav-tabs"><li class="trm-tab active"><button type="button" data-href="#mysql数据库-1">FREEDB.TECH</button></li><li class="trm-tab"><button type="button" data-href="#mysql数据库-2">db4free（不推荐，官网访问较慢）</button></li><li class="trm-tab"><button type="button" data-href="#mysql数据库-3">SQLPub（推荐）</button></li></ul><div class="trm-tab-contents"><div class="trm-tab-item-content active" id="mysql数据库-1"><p>打开<a href="https://freedb.tech/">FREEDB.TECH</a>，注册登录，创建数据库和用户</p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230714/msedge_gi9vdCGiIt.48n3g4pzzvw0.webp" alt="msedge_gi9vdCGiIt"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p>得到你的数据库和密码：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230714/msedge_fGVbS9POH4.409i0oz7v9k0.webp" alt="msedge_fGVbS9POH4"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p>组合一下：<br><figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line">mysql://（DATABASE USER）:（PASSWORD）@（HOST）:（PORT）/（DATABASE NAME）</span><br></pre></td></tr></table></figure></p></div><div class="trm-tab-item-content" id="mysql数据库-2"><div class="trm-note warning"><div class="trm-note-title">WARNING</div><p>这个数据库疑似国人开办，建议用国内邮箱收验证码，国外的基本收不到<br>（转自：<a href="https://www.freeaday.com/2023/01/db4free/">https://www.freeaday.com/2023/01/db4free/</a> 的一条评论）</p>
+</div>
+
+<p><p>打开<a href="https://www.db4free.net/">db4free</a>，点击“注册免费账号”，输入信息然后点击“注册”，一会后你会收到如下邮件：</p></p>
+<p><p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230714/网易灵犀办公_JmFVOuOEIc.30smaneqwfa0.webp" alt="网易灵犀办公_JmFVOuOEIc"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p></p>
+<p><p>访问邮件提供的确认网址，数据库就创建成功了</p></p>
+<p><p>然后将你设置的信息替换掉下面括号里的内容（注意：括号得去掉）：<br><figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line">mysql://（你设置的数据库用户名）:（你设置的数据库密码）@db4free.net:3306/（你设置的数据库名）</span><br></pre></td></tr></table></figure></p>&lt;/div&gt;<div class="trm-tab-item-content" id="mysql数据库-3"><p>访问<a href="https://sqlpub.com/">SQLPub</a>，输入账号密码，点击申请，申请成功后会有如下提示<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230714/msedge_8FyIBEs6Ja.14toupglasps.webp" alt="msedge_8FyIBEs6Ja"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>然后将里面的替换掉下面括号里的内容（注意：括号得去掉）：<br><figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line">mysql://（数据库用户）:（数据库密码）@（数据库地址）/（数据库名称）</span><br></pre></td></tr></table></figure></p></div>&lt;/div&gt;&lt;/div&gt;</p></div><div class="trm-tab-item-content" id="数据库部署-2"><div class="trm-tabs" id="postgresql"><ul class="trm-nav-tabs"><li class="trm-tab active"><button type="button" data-href="#postgresql-1">Supabase（推荐）</button></li><li class="trm-tab"><button type="button" data-href="#postgresql-2">ElephantSQL</button></li></ul><div class="trm-tab-contents"><div class="trm-tab-item-content active" id="postgresql-1"><p>打开<a href="https://supabase.com/">Supabase</a>，推荐使用Github登录。登陆成功后，创建一个新的项目New project-&gt;personal。</p>
+<ul>
+<li>Name：随意</li>
+<li>Database Password：建议点击Generate a password生成</li>
+<li>Region：建议选择US，因为Vercel的免费服务器在漂亮国</li>
+<li>Pricing Plan：Free白嫖</li>
+</ul>
+<p>创建成功后，打开菜单Project Setting -&gt; Database -&gt; Connection string -&gt; URI，如下图：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230714/image.3jutc7fp3fc0.webp" alt="image"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>将红框内的内容复制下来，然后把<code>[YOUR-PASSWORD]</code>替换成你生成的密码，复制备用</p></div><div class="trm-tab-item-content" id="postgresql-2"><p>打开ElephantSQL，推荐使用Github登录，创建一个新的实例。Plan选择Tiny Turtle(Free)、Region随意，提交创建。<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230714/msedge_ELQQZsgMsH.68dwkz5in1w0.webp" alt="msedge_ELQQZsgMsH"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>打开刚刚创建的示例，找到URL，点击眼睛图标，然后将URL复制下来备用</p></div></div></div></div></div></div>
+<h1 id="Vercel部署"><a href="#Vercel部署" class="headerlink" title="Vercel部署"></a>Vercel部署</h1><p><a href="https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fmikecao%2Fumami&amp;env=DATABASE_URL,HASH_SALT,TRACKER_SCRIPT_NAME&amp;envDescription=These%20values%20are%20defined%20in%20the%20configure%20Umami%20step%20from%20Install&amp;envLink=https%3A%2F%2Fumami.is%2Fdocs%2Finstall&amp;project-name=umami&amp;repo-name=umami"><img src="https://vercel.com/button" alt="部署到Vercel"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></a></p>
+<ol>
+<li>点击上方按钮，跳转至 Vercel 进行 Server 端部署</li>
+<li><div class="trm-note info"><div class="trm-note-title">INFO</div><p>如果你未登录的话，Vercel 会让你注册或登录，请使用 GitHub 账户进行快捷登录。</p>
+</div>
+</li>
+<li><p>输入一个你喜欢的 Vercel 项目名称并点击 Create 继续:</p>
+</li>
+</ol>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230714/msedge_EtpjrPwPlG.4zkys81bppo0.webp" alt="msedge_EtpjrPwPlG"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<ol>
+<li>配置环境变量</li>
+</ol>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230714/msedge_EtpjrPwPlG.4zkys81bppo0.webp" alt="msedge_EtpjrPwPlG"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>部署完成后，会跳转到环境变量部分，请按照如下方式配置环境变量：<br>| 名称      | 说明     |<br>| —————- | —————- |<br>|DATABASE_URL|（必填）数据库链接|<br>|HASH_SALT|（必填）任意字符串，推荐<a href="https://uuid.bmcx.com/">这里</a>生成一串UUID|<br>|TRACKER_SCRIPT_NAME|（建议）任意字符串，推荐<a href="https://uuid.bmcx.com/">这里</a>生成一串UUID（不填会导致去广告插件把这段脚本给拦截）|</p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230714/msedge_3VF46Qh4uk.6ebntqavbmw.webp" alt="msedge_3VF46Qh4uk"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p>配置完成后点击Deploy开始部署，部署过程大概两分钟，部署成功后会有一个彩纸的喜庆页面。</p>
+<h1 id="绑定域名"><a href="#绑定域名" class="headerlink" title="绑定域名"></a>绑定域名</h1><p>点击Go to Dashboard，进入Settings——&gt;Domains绑定域名</p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230714/image.6kbvzv14uic.webp" alt="image"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p>你绑定的域名就是umami的后台网址</p>
+<h1 id="配置后台"><a href="#配置后台" class="headerlink" title="配置后台"></a>配置后台</h1><p>点击你绑定的域名，进入Umami后台登录（默认用户名admin和密码umami）进入后第一时间修改密码。</p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230714/msedge_V6f3L8vvos.3pvc55z6eqw0.webp" alt="msedge_V6f3L8vvos"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<h1 id="添加站点-amp-获取代码"><a href="#添加站点-amp-获取代码" class="headerlink" title="添加站点 &amp; 获取代码"></a>添加站点 &amp; 获取代码</h1><p>“网站”—-&gt;“添加网站”添加你自己的网站</p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230714/image.x9jagr7mvxc.webp" alt="image"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p>保存后点击“编辑”—-&gt;“跟踪代码”，将获取到的代码放进你的站点</p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230714/msedge_trQnJ47k75.20wh55o85wkg.webp" alt="msedge_trQnJ47k75"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p>不久后就能看到你的站点数据了</p>
+<h1 id="问题"><a href="#问题" class="headerlink" title="问题"></a>问题</h1><ul>
+<li>Umami无法登录，提示“Failed to load resource: the server responded with a status of 405”<br>等待几分钟后登录重试</li>
+<li>使用Supabase数据库时，Vercel提示这个错误：</li>
+</ul>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230714/msedge_D1X7RIZpUD.5wxtzukahdo0.webp" alt="msedge_D1X7RIZpUD"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p>建议重新新建数据库，还不行的话更换别的数据库</p>
+]]></content>
+      <categories>
+        <category>站点折腾</category>
+      </categories>
+      <tags>
+        <tag>站点折腾</tag>
+        <tag>自建部署</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>Serv00搭建Artalk</title>
+    <url>/posts/13624/</url>
+    <content><![CDATA[<p>之前在安小歪的推荐下，找到了一个叫serv00的东西<br>但是因为这玩意我不会用，所以我把Serv00一直当成不能部署thinkphp的虚拟主机使用<br>然而我之前看见了这个教程：<br><div class="tag link"><a class="link_card" referrerPolicy="no-referrer" title="Serv00搭建各种服务" href="https://blog.rappit.site/2024/01/27/serv00_logs/"><div class="link_icon"><svg t="1670307855063" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="19066" width="200" height="200"><path d="M504.064 516.608m-384.256 0a384.256 384.256 0 1 0 768.512 0 384.256 384.256 0 1 0-768.512 0Z" fill="#009CF5" p-id="19068"></path><path d="M746.112 270.464L472.448 485.12l63.104 63.104L750.08 274.56c2.304-2.688-1.28-6.144-3.968-4.096z" fill="#FF4C3A" p-id="19069"></path><path d="M262.016 762.752l273.664-214.528-63.104-63.104-214.656 273.536c-2.176 2.688 1.28 6.144 4.096 4.096z" fill="#FFFFFF" p-id="19070"></path><path d="M505.216 155.136c-3.2 0-5.888 2.56-5.888 5.888v53.504c0 3.2 2.56 5.888 5.888 5.888s5.888-2.56 5.888-5.888v-53.504c-0.128-3.2-2.688-5.888-5.888-5.888zM442.368 160.512c-3.2 0.512-5.376 3.584-4.736 6.784l9.344 52.736c0.512 3.2 3.584 5.376 6.784 4.736 3.2-0.512 5.376-3.584 4.736-6.784l-9.344-52.736c-0.512-3.2-3.584-5.376-6.784-4.736zM396.288 234.368c1.152 3.072 4.48 4.608 7.552 3.456 3.072-1.152 4.608-4.48 3.456-7.552l-18.304-50.304c-1.152-3.072-4.48-4.608-7.552-3.456-3.072 1.152-4.608 4.48-3.456 7.552l18.304 50.304zM348.928 257.408c1.664 2.816 5.248 3.712 7.936 2.176s3.712-5.248 2.176-7.936l-26.752-46.336c-1.664-2.816-5.248-3.712-7.936-2.176-2.816 1.664-3.712 5.248-2.176 7.936l26.752 46.336zM306.304 288.256c2.048 2.432 5.76 2.816 8.192 0.768 2.432-2.048 2.816-5.76 0.768-8.192l-34.432-40.96c-2.048-2.432-5.76-2.816-8.192-0.768-2.432 2.048-2.816 5.76-0.768 8.192l34.432 40.96zM269.696 326.144c2.432 2.048 6.144 1.792 8.192-0.768 2.048-2.432 1.792-6.144-0.768-8.192l-40.96-34.432c-2.432-2.048-6.144-1.792-8.192 0.768-2.048 2.432-1.792 6.144 0.768 8.192l40.96 34.432zM193.792 342.912l46.336 26.752c2.816 1.664 6.4 0.64 7.936-2.176 1.664-2.816 0.64-6.4-2.176-8.064L199.552 332.8c-2.816-1.664-6.4-0.64-7.936 2.176-1.664 2.688-0.64 6.272 2.176 7.936zM168.32 399.488l50.304 18.304c3.072 1.152 6.4-0.512 7.552-3.456 1.152-3.072-0.512-6.4-3.456-7.552l-50.304-18.304c-3.072-1.152-6.4 0.512-7.552 3.456-1.152 3.072 0.384 6.4 3.456 7.552zM207.872 457.344l-52.736-9.344c-3.2-0.512-6.272 1.536-6.784 4.736-0.512 3.2 1.536 6.272 4.736 6.784l52.736 9.344c3.2 0.512 6.272-1.536 6.784-4.736 0.512-3.2-1.536-6.272-4.736-6.784zM201.984 509.568H148.48c-3.2 0-5.888 2.56-5.888 5.888 0 3.2 2.56 5.888 5.888 5.888h53.504c3.2 0 5.888-2.56 5.888-5.888 0-3.2-2.56-5.888-5.888-5.888zM205.44 562.176l-52.736 9.344c-3.2 0.512-5.376 3.584-4.736 6.784 0.512 3.2 3.584 5.376 6.784 4.736l52.736-9.344c3.2-0.512 5.376-3.584 4.736-6.784s-3.584-5.248-6.784-4.736zM217.856 613.376l-50.304 18.304c-3.072 1.152-4.608 4.48-3.456 7.552 1.152 3.072 4.48 4.608 7.552 3.456l50.304-18.304c3.072-1.152 4.608-4.48 3.456-7.552-1.152-3.072-4.48-4.608-7.552-3.456zM238.976 661.504l-46.336 26.752c-2.816 1.664-3.712 5.248-2.176 8.064 1.664 2.816 5.248 3.712 8.064 2.176l46.336-26.752c2.816-1.664 3.712-5.248 2.176-8.064-1.664-2.816-5.248-3.712-8.064-2.176zM268.16 705.408l-40.96 34.432c-2.432 2.048-2.816 5.76-0.768 8.192 2.048 2.432 5.76 2.816 8.192 0.768l40.96-34.432c2.432-2.048 2.816-5.76 0.768-8.192-1.92-2.56-5.632-2.816-8.192-0.768zM304.512 743.424l-34.432 40.96c-2.048 2.432-1.792 6.144 0.768 8.192 2.432 2.048 6.144 1.792 8.192-0.768l34.432-40.96c2.048-2.432 1.792-6.144-0.768-8.192-2.304-1.92-6.016-1.664-8.192 0.768zM347.008 774.656l-26.752 46.336c-1.664 2.816-0.64 6.4 2.176 7.936 2.816 1.664 6.4 0.64 8.064-2.176l26.752-46.336c1.664-2.816 0.64-6.4-2.176-7.936-2.816-1.536-6.4-0.64-8.064 2.176zM394.24 798.08l-18.304 50.304c-1.152 3.072 0.512 6.4 3.456 7.552 3.072 1.152 6.4-0.512 7.552-3.456l18.304-50.304c1.152-3.072-0.512-6.4-3.456-7.552-3.072-1.152-6.528 0.384-7.552 3.456zM440.192 872.32c3.2 0.512 6.272-1.536 6.784-4.736l9.344-52.736c0.512-3.2-1.536-6.272-4.736-6.784-3.2-0.512-6.272 1.536-6.784 4.736l-9.344 52.736c-0.64 3.2 1.536 6.272 4.736 6.784zM502.912 878.08c3.2 0 5.888-2.56 5.888-5.888v-53.504c0-3.2-2.56-5.888-5.888-5.888-3.2 0-5.888 2.56-5.888 5.888v53.504c0 3.2 2.688 5.888 5.888 5.888zM549.632 815.232l9.344 52.736c0.512 3.2 3.584 5.376 6.784 4.736 3.2-0.512 5.376-3.584 4.736-6.784l-9.344-52.736c-0.512-3.2-3.584-5.376-6.784-4.736-3.2 0.512-5.248 3.584-4.736 6.784zM600.832 802.816l18.304 50.304c1.152 3.072 4.48 4.608 7.552 3.456 3.072-1.152 4.608-4.48 3.456-7.552L611.84 798.72c-1.152-3.072-4.48-4.608-7.552-3.456-3.072 1.152-4.608 4.48-3.456 7.552zM649.088 781.696l26.752 46.336c1.664 2.816 5.248 3.712 8.064 2.176 2.816-1.664 3.712-5.248 2.176-8.064l-26.88-46.336c-1.664-2.816-5.248-3.712-8.064-2.176-2.816 1.664-3.712 5.248-2.048 8.064zM692.864 752.384l34.432 40.96c2.048 2.432 5.76 2.816 8.192 0.768 2.432-2.048 2.816-5.76 0.768-8.192l-34.432-40.96c-2.048-2.432-5.76-2.816-8.192-0.768-2.56 2.048-2.816 5.76-0.768 8.192zM730.88 716.032l40.96 34.432c2.432 2.048 6.144 1.792 8.192-0.768 2.048-2.432 1.792-6.144-0.768-8.192l-40.96-34.432c-2.432-2.048-6.144-1.792-8.192 0.768-1.92 2.432-1.664 6.144 0.768 8.192zM762.112 673.664l46.336 26.752c2.816 1.664 6.4 0.64 8.064-2.176 1.664-2.816 0.64-6.4-2.176-7.936L768 663.552c-2.816-1.664-6.4-0.64-8.064 2.176-1.536 2.688-0.64 6.272 2.176 7.936zM785.536 626.432l50.304 18.304c3.072 1.152 6.4-0.512 7.552-3.456 1.152-3.072-0.512-6.4-3.456-7.552l-50.304-18.304c-3.072-1.152-6.4 0.512-7.552 3.456-1.152 3.072 0.384 6.4 3.456 7.552zM800.256 575.872l52.736 9.344c3.2 0.512 6.272-1.536 6.784-4.736 0.512-3.2-1.536-6.272-4.736-6.784l-52.736-9.344c-3.2-0.512-6.272 1.536-6.784 4.736-0.512 3.2 1.536 6.272 4.736 6.784zM800.256 517.76c0 3.2 2.56 5.888 5.888 5.888h53.504c3.2 0 5.888-2.56 5.888-5.888 0-3.2-2.56-5.888-5.888-5.888h-53.504c-3.328 0-5.888 2.56-5.888 5.888zM802.688 471.04l52.736-9.344c3.2-0.512 5.376-3.584 4.736-6.784-0.512-3.2-3.584-5.376-6.784-4.736l-52.736 9.344c-3.2 0.512-5.376 3.584-4.736 6.784 0.512 3.2 3.584 5.248 6.784 4.736zM790.272 419.84l50.304-18.304c3.072-1.152 4.608-4.48 3.456-7.552-1.152-3.072-4.48-4.608-7.552-3.456l-50.304 18.304c-3.072 1.152-4.608 4.48-3.456 7.552 1.152 2.944 4.48 4.608 7.552 3.456zM769.152 371.584l46.336-26.752c2.816-1.664 3.712-5.248 2.176-7.936-1.664-2.816-5.248-3.712-8.064-2.176l-46.336 26.752c-2.816 1.664-3.712 5.248-2.176 8.064 1.664 2.688 5.248 3.712 8.064 2.048zM739.84 327.808l40.96-34.432c2.432-2.048 2.816-5.76 0.768-8.192-2.048-2.432-5.76-2.816-8.192-0.768l-40.96 34.432c-2.432 2.048-2.816 5.76-0.768 8.192 2.048 2.56 5.76 2.816 8.192 0.768zM703.488 289.664l34.432-40.96c2.048-2.432 1.792-6.144-0.768-8.192-2.432-2.048-6.144-1.792-8.192 0.768l-34.432 40.96c-2.048 2.432-1.792 6.144 0.768 8.192 2.432 2.048 6.144 1.792 8.192-0.768zM661.12 258.56l26.752-46.336c1.664-2.816 0.64-6.4-2.176-7.936-2.816-1.664-6.4-0.64-8.064 2.176l-26.752 46.336c-1.664 2.816-0.64 6.4 2.176 7.936 2.816 1.536 6.4 0.64 8.064-2.176zM613.888 235.136l18.304-50.304c1.152-3.072-0.512-6.4-3.456-7.552-3.072-1.152-6.4 0.512-7.552 3.456L602.88 231.168c-1.152 3.072 0.512 6.4 3.456 7.552 3.072 1.024 6.4-0.512 7.552-3.584zM556.544 225.152c3.2 0.512 6.272-1.536 6.784-4.736l9.344-52.736c0.512-3.2-1.536-6.272-4.736-6.784-3.2-0.512-6.272 1.536-6.784 4.736l-9.344 52.736c-0.512 3.2 1.536 6.144 4.736 6.784zM273.536 290.432c2.432 2.432 6.528 2.432 8.96 0 2.432-2.432 2.432-6.528 0-8.96l-21.12-21.12c-2.432-2.432-6.528-2.432-8.96 0-2.432 2.432-2.432 6.528 0 8.96l21.12 21.12zM237.824 333.824c2.944 2.048 6.912 1.28 8.832-1.536 2.048-2.944 1.28-6.912-1.536-8.832l-24.448-17.152c-2.944-2.048-6.912-1.28-8.832 1.536s-1.28 6.912 1.536 8.832l24.448 17.152zM183.04 370.176l27.136 12.672c3.2 1.536 7.04 0.128 8.448-3.072 1.536-3.2 0.128-7.04-3.072-8.448l-27.136-12.672c-3.2-1.536-7.04-0.128-8.448 3.072-1.536 3.2-0.128 7.04 3.072 8.448zM194.688 423.68l-28.928-7.68c-3.456-0.896-6.912 1.152-7.808 4.48-0.896 3.456 1.152 6.912 4.48 7.808l28.928 7.68c3.456 0.896 6.912-1.152 7.808-4.48 0.896-3.456-1.152-6.912-4.48-7.808zM183.168 478.72l-29.824-2.56c-3.456-0.256-6.656 2.304-6.912 5.76-0.256 3.456 2.304 6.656 5.76 6.912l29.824 2.56c3.456 0.256 6.656-2.304 6.912-5.76 0.384-3.456-2.176-6.528-5.76-6.912zM181.504 535.04l-29.824 2.56c-3.456 0.256-6.144 3.456-5.76 6.912 0.256 3.456 3.456 6.144 6.912 5.76l29.824-2.56c3.456-0.256 6.144-3.456 5.76-6.912-0.256-3.456-3.328-6.016-6.912-5.76zM191.36 590.72l-28.928 7.68c-3.456 0.896-5.376 4.352-4.48 7.808 0.896 3.456 4.352 5.376 7.808 4.48l28.928-7.68c3.456-0.896 5.376-4.352 4.48-7.808-0.896-3.328-4.352-5.376-7.808-4.48zM207.232 644.224l-27.136 12.672c-3.2 1.536-4.608 5.248-3.072 8.448 1.536 3.2 5.248 4.608 8.448 3.072l27.136-12.672c3.2-1.536 4.608-5.248 3.072-8.448-1.408-3.2-5.248-4.48-8.448-3.072zM233.984 693.888l-24.448 17.152c-2.944 2.048-3.584 6.016-1.536 8.832 2.048 2.944 6.016 3.584 8.832 1.536l24.448-17.152c2.944-2.048 3.584-6.016 1.536-8.832-2.048-2.944-6.016-3.584-8.832-1.536zM310.912 775.552L293.76 800c-2.048 2.944-1.28 6.912 1.536 8.832 2.944 2.048 6.912 1.28 8.832-1.536l17.152-24.448c2.048-2.944 1.28-6.912-1.536-8.832-2.816-2.048-6.912-1.408-8.832 1.536zM349.184 840.704c3.2 1.536 7.04 0.128 8.448-3.072l12.672-27.136c1.536-3.2 0.128-7.04-3.072-8.448-3.2-1.536-7.04-0.128-8.448 3.072l-12.672 27.136c-1.408 3.2-0.128 6.912 3.072 8.448zM407.808 862.72c3.456 0.896 6.912-1.152 7.808-4.48l7.68-28.928c0.896-3.456-1.152-6.912-4.48-7.808-3.456-0.896-6.912 1.152-7.808 4.48l-7.68 28.928c-0.896 3.328 1.152 6.912 4.48 7.808zM469.376 874.112c3.456 0.256 6.656-2.304 6.912-5.76l2.56-29.824c0.256-3.456-2.304-6.656-5.76-6.912-3.456-0.256-6.656 2.304-6.912 5.76l-2.56 29.824c-0.256 3.584 2.304 6.656 5.76 6.912zM522.496 839.168l2.56 29.824c0.256 3.456 3.456 6.144 6.912 5.76 3.456-0.256 6.144-3.456 5.76-6.912l-2.56-29.824c-0.256-3.456-3.456-6.144-6.912-5.76-3.456 0.256-6.016 3.328-5.76 6.912zM578.176 830.976l7.68 28.928c0.896 3.456 4.352 5.376 7.808 4.48 3.456-0.896 5.376-4.352 4.48-7.808l-7.68-28.928c-0.896-3.456-4.352-5.376-7.808-4.48-3.328 0.896-5.376 4.48-4.48 7.808zM631.68 813.312l12.672 27.136c1.536 3.2 5.248 4.608 8.448 3.072 3.2-1.536 4.608-5.248 3.072-8.448l-12.672-27.136c-1.536-3.2-5.248-4.608-8.448-3.072-3.2 1.536-4.48 5.248-3.072 8.448zM681.344 786.688l17.152 24.448c2.048 2.944 6.016 3.584 8.832 1.536 2.944-2.048 3.584-6.016 1.536-8.832l-17.152-24.448c-2.048-2.944-6.016-3.584-8.832-1.536-2.944 1.92-3.584 5.888-1.536 8.832zM725.504 751.744l21.12 21.12c2.432 2.432 6.528 2.432 8.96 0 2.432-2.432 2.432-6.528 0-8.96l-21.12-21.12c-2.432-2.432-6.528-2.432-8.96 0-2.432 2.432-2.432 6.528 0 8.96zM763.008 709.76l24.448 17.152c2.944 2.048 6.912 1.28 8.832-1.536 2.048-2.944 1.28-6.912-1.536-8.832l-24.448-17.152c-2.944-2.048-6.912-1.28-8.832 1.536-2.048 2.816-1.408 6.784 1.536 8.832zM792.576 661.888l27.136 12.672c3.2 1.536 7.04 0.128 8.448-3.072 1.536-3.2 0.128-7.04-3.072-8.448l-27.136-12.672c-3.2-1.536-7.04-0.128-8.448 3.072-1.536 3.2-0.128 6.912 3.072 8.448zM813.44 609.536l28.928 7.68c3.456 0.896 6.912-1.152 7.808-4.48 0.896-3.456-1.152-6.912-4.48-7.808l-28.928-7.68c-3.456-0.896-6.912 1.152-7.808 4.48-0.896 3.456 1.024 6.912 4.48 7.808zM824.832 554.368l29.824 2.56c3.456 0.256 6.656-2.304 6.912-5.76 0.256-3.456-2.304-6.656-5.76-6.912l-29.824-2.56c-3.456-0.256-6.656 2.304-6.912 5.76-0.256 3.584 2.304 6.656 5.76 6.912zM826.624 498.176l29.824-2.56c3.456-0.256 6.144-3.456 5.76-6.912-0.256-3.456-3.456-6.144-6.912-5.76l-29.824 2.56c-3.456 0.256-6.144 3.456-5.76 6.912 0.256 3.456 3.328 6.016 6.912 5.76zM818.432 442.368l28.928-7.68c3.456-0.896 5.376-4.352 4.48-7.808-0.896-3.456-4.352-5.376-7.808-4.48l-28.928 7.68c-3.456 0.896-5.376 4.352-4.48 7.808 0.896 3.456 4.48 5.376 7.808 4.48zM800.768 388.992l27.136-12.672c3.2-1.536 4.608-5.248 3.072-8.448-1.536-3.2-5.248-4.608-8.448-3.072l-27.136 12.672c-3.2 1.536-4.608 5.248-3.072 8.448 1.536 3.072 5.248 4.48 8.448 3.072zM774.144 339.328l24.448-17.152c2.944-2.048 3.584-6.016 1.536-8.832-2.048-2.944-6.016-3.584-8.832-1.536L766.848 328.96c-2.944 2.048-3.584 6.016-1.536 8.832 1.92 2.816 5.888 3.584 8.832 1.536zM697.216 257.664l17.152-24.448c2.048-2.944 1.28-6.912-1.536-8.832-2.944-2.048-6.912-1.28-8.832 1.536l-17.152 24.448c-2.048 2.944-1.28 6.912 1.536 8.832 2.816 2.048 6.784 1.408 8.832-1.536zM658.944 192.512c-3.2-1.536-7.04-0.128-8.448 3.072l-12.672 27.136c-1.536 3.2-0.128 7.04 3.072 8.448 3.2 1.536 7.04 0.128 8.448-3.072l12.672-27.136c1.408-3.2 0-7.04-3.072-8.448zM600.192 170.496c-3.456-0.896-6.912 1.152-7.808 4.48l-7.68 28.928c-0.896 3.456 1.152 6.912 4.48 7.808 3.456 0.896 6.912-1.152 7.808-4.48l7.68-28.928c1.024-3.328-1.024-6.912-4.48-7.808zM534.912 201.6c3.456 0.256 6.656-2.304 6.912-5.76l2.56-29.824c0.256-3.456-2.304-6.656-5.76-6.912-3.456-0.256-6.656 2.304-6.912 5.76l-2.56 29.824c-0.256 3.456 2.304 6.528 5.76 6.912zM476.032 158.464c-3.456 0.256-6.144 3.456-5.76 6.912l2.56 29.824c0.256 3.456 3.456 6.144 6.912 5.76 3.456-0.256 6.144-3.456 5.76-6.912l-2.56-29.824c-0.256-3.456-3.328-6.016-6.912-5.76zM422.144 173.312c-0.896-3.456-4.352-5.376-7.808-4.48-3.456 0.896-5.376 4.352-4.48 7.808l7.68 28.928c0.896 3.456 4.352 5.376 7.808 4.48 3.456-0.896 5.376-4.352 4.48-7.808l-7.68-28.928zM376.448 219.776l-12.672-27.136c-1.536-3.2-5.248-4.608-8.448-3.072-3.2 1.536-4.608 5.248-3.072 8.448L364.8 225.28c1.536 3.2 5.248 4.608 8.448 3.072 3.2-1.536 4.608-5.376 3.2-8.576zM316.416 253.824c2.048 2.944 6.016 3.584 8.832 1.536 2.944-2.048 3.584-6.016 1.536-8.832l-17.152-24.448c-2.048-2.944-6.016-3.584-8.832-1.536-2.944 2.048-3.584 6.016-1.536 8.832l17.152 24.448z" fill="#FFFFFF" p-id="19071"></path></svg></div><div class="link_content"><div class="link_title">Serv00搭建各种服务</div></div></a></div><br>于是我决定在Serv00搭建一些项目<br>但里面没有Artalk的教程，我准备所以按照部署Alist的方法给Serv00部署Artalk<br>那么好，教程开始！</p>
+<h1 id="教程"><a href="#教程" class="headerlink" title="教程"></a>教程</h1><h2 id="准备工作"><a href="#准备工作" class="headerlink" title="准备工作"></a>准备工作</h2><div class="tag link"><a class="link_card" referrerPolicy="no-referrer" title="Serv00搭建各种服务·部署应用前的一些准备工作" href="https://blog.rappit.site/2024/01/27/serv00_logs/#%E9%83%A8%E7%BD%B2%E5%BA%94%E7%94%A8%E5%89%8D%E7%9A%84%E4%B8%80%E4%BA%9B%E5%87%86%E5%A4%87%E5%B7%A5%E4%BD%9C"><div class="link_icon"><svg t="1670307855063" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="19066" width="200" height="200"><path d="M504.064 516.608m-384.256 0a384.256 384.256 0 1 0 768.512 0 384.256 384.256 0 1 0-768.512 0Z" fill="#009CF5" p-id="19068"></path><path d="M746.112 270.464L472.448 485.12l63.104 63.104L750.08 274.56c2.304-2.688-1.28-6.144-3.968-4.096z" fill="#FF4C3A" p-id="19069"></path><path d="M262.016 762.752l273.664-214.528-63.104-63.104-214.656 273.536c-2.176 2.688 1.28 6.144 4.096 4.096z" fill="#FFFFFF" p-id="19070"></path><path d="M505.216 155.136c-3.2 0-5.888 2.56-5.888 5.888v53.504c0 3.2 2.56 5.888 5.888 5.888s5.888-2.56 5.888-5.888v-53.504c-0.128-3.2-2.688-5.888-5.888-5.888zM442.368 160.512c-3.2 0.512-5.376 3.584-4.736 6.784l9.344 52.736c0.512 3.2 3.584 5.376 6.784 4.736 3.2-0.512 5.376-3.584 4.736-6.784l-9.344-52.736c-0.512-3.2-3.584-5.376-6.784-4.736zM396.288 234.368c1.152 3.072 4.48 4.608 7.552 3.456 3.072-1.152 4.608-4.48 3.456-7.552l-18.304-50.304c-1.152-3.072-4.48-4.608-7.552-3.456-3.072 1.152-4.608 4.48-3.456 7.552l18.304 50.304zM348.928 257.408c1.664 2.816 5.248 3.712 7.936 2.176s3.712-5.248 2.176-7.936l-26.752-46.336c-1.664-2.816-5.248-3.712-7.936-2.176-2.816 1.664-3.712 5.248-2.176 7.936l26.752 46.336zM306.304 288.256c2.048 2.432 5.76 2.816 8.192 0.768 2.432-2.048 2.816-5.76 0.768-8.192l-34.432-40.96c-2.048-2.432-5.76-2.816-8.192-0.768-2.432 2.048-2.816 5.76-0.768 8.192l34.432 40.96zM269.696 326.144c2.432 2.048 6.144 1.792 8.192-0.768 2.048-2.432 1.792-6.144-0.768-8.192l-40.96-34.432c-2.432-2.048-6.144-1.792-8.192 0.768-2.048 2.432-1.792 6.144 0.768 8.192l40.96 34.432zM193.792 342.912l46.336 26.752c2.816 1.664 6.4 0.64 7.936-2.176 1.664-2.816 0.64-6.4-2.176-8.064L199.552 332.8c-2.816-1.664-6.4-0.64-7.936 2.176-1.664 2.688-0.64 6.272 2.176 7.936zM168.32 399.488l50.304 18.304c3.072 1.152 6.4-0.512 7.552-3.456 1.152-3.072-0.512-6.4-3.456-7.552l-50.304-18.304c-3.072-1.152-6.4 0.512-7.552 3.456-1.152 3.072 0.384 6.4 3.456 7.552zM207.872 457.344l-52.736-9.344c-3.2-0.512-6.272 1.536-6.784 4.736-0.512 3.2 1.536 6.272 4.736 6.784l52.736 9.344c3.2 0.512 6.272-1.536 6.784-4.736 0.512-3.2-1.536-6.272-4.736-6.784zM201.984 509.568H148.48c-3.2 0-5.888 2.56-5.888 5.888 0 3.2 2.56 5.888 5.888 5.888h53.504c3.2 0 5.888-2.56 5.888-5.888 0-3.2-2.56-5.888-5.888-5.888zM205.44 562.176l-52.736 9.344c-3.2 0.512-5.376 3.584-4.736 6.784 0.512 3.2 3.584 5.376 6.784 4.736l52.736-9.344c3.2-0.512 5.376-3.584 4.736-6.784s-3.584-5.248-6.784-4.736zM217.856 613.376l-50.304 18.304c-3.072 1.152-4.608 4.48-3.456 7.552 1.152 3.072 4.48 4.608 7.552 3.456l50.304-18.304c3.072-1.152 4.608-4.48 3.456-7.552-1.152-3.072-4.48-4.608-7.552-3.456zM238.976 661.504l-46.336 26.752c-2.816 1.664-3.712 5.248-2.176 8.064 1.664 2.816 5.248 3.712 8.064 2.176l46.336-26.752c2.816-1.664 3.712-5.248 2.176-8.064-1.664-2.816-5.248-3.712-8.064-2.176zM268.16 705.408l-40.96 34.432c-2.432 2.048-2.816 5.76-0.768 8.192 2.048 2.432 5.76 2.816 8.192 0.768l40.96-34.432c2.432-2.048 2.816-5.76 0.768-8.192-1.92-2.56-5.632-2.816-8.192-0.768zM304.512 743.424l-34.432 40.96c-2.048 2.432-1.792 6.144 0.768 8.192 2.432 2.048 6.144 1.792 8.192-0.768l34.432-40.96c2.048-2.432 1.792-6.144-0.768-8.192-2.304-1.92-6.016-1.664-8.192 0.768zM347.008 774.656l-26.752 46.336c-1.664 2.816-0.64 6.4 2.176 7.936 2.816 1.664 6.4 0.64 8.064-2.176l26.752-46.336c1.664-2.816 0.64-6.4-2.176-7.936-2.816-1.536-6.4-0.64-8.064 2.176zM394.24 798.08l-18.304 50.304c-1.152 3.072 0.512 6.4 3.456 7.552 3.072 1.152 6.4-0.512 7.552-3.456l18.304-50.304c1.152-3.072-0.512-6.4-3.456-7.552-3.072-1.152-6.528 0.384-7.552 3.456zM440.192 872.32c3.2 0.512 6.272-1.536 6.784-4.736l9.344-52.736c0.512-3.2-1.536-6.272-4.736-6.784-3.2-0.512-6.272 1.536-6.784 4.736l-9.344 52.736c-0.64 3.2 1.536 6.272 4.736 6.784zM502.912 878.08c3.2 0 5.888-2.56 5.888-5.888v-53.504c0-3.2-2.56-5.888-5.888-5.888-3.2 0-5.888 2.56-5.888 5.888v53.504c0 3.2 2.688 5.888 5.888 5.888zM549.632 815.232l9.344 52.736c0.512 3.2 3.584 5.376 6.784 4.736 3.2-0.512 5.376-3.584 4.736-6.784l-9.344-52.736c-0.512-3.2-3.584-5.376-6.784-4.736-3.2 0.512-5.248 3.584-4.736 6.784zM600.832 802.816l18.304 50.304c1.152 3.072 4.48 4.608 7.552 3.456 3.072-1.152 4.608-4.48 3.456-7.552L611.84 798.72c-1.152-3.072-4.48-4.608-7.552-3.456-3.072 1.152-4.608 4.48-3.456 7.552zM649.088 781.696l26.752 46.336c1.664 2.816 5.248 3.712 8.064 2.176 2.816-1.664 3.712-5.248 2.176-8.064l-26.88-46.336c-1.664-2.816-5.248-3.712-8.064-2.176-2.816 1.664-3.712 5.248-2.048 8.064zM692.864 752.384l34.432 40.96c2.048 2.432 5.76 2.816 8.192 0.768 2.432-2.048 2.816-5.76 0.768-8.192l-34.432-40.96c-2.048-2.432-5.76-2.816-8.192-0.768-2.56 2.048-2.816 5.76-0.768 8.192zM730.88 716.032l40.96 34.432c2.432 2.048 6.144 1.792 8.192-0.768 2.048-2.432 1.792-6.144-0.768-8.192l-40.96-34.432c-2.432-2.048-6.144-1.792-8.192 0.768-1.92 2.432-1.664 6.144 0.768 8.192zM762.112 673.664l46.336 26.752c2.816 1.664 6.4 0.64 8.064-2.176 1.664-2.816 0.64-6.4-2.176-7.936L768 663.552c-2.816-1.664-6.4-0.64-8.064 2.176-1.536 2.688-0.64 6.272 2.176 7.936zM785.536 626.432l50.304 18.304c3.072 1.152 6.4-0.512 7.552-3.456 1.152-3.072-0.512-6.4-3.456-7.552l-50.304-18.304c-3.072-1.152-6.4 0.512-7.552 3.456-1.152 3.072 0.384 6.4 3.456 7.552zM800.256 575.872l52.736 9.344c3.2 0.512 6.272-1.536 6.784-4.736 0.512-3.2-1.536-6.272-4.736-6.784l-52.736-9.344c-3.2-0.512-6.272 1.536-6.784 4.736-0.512 3.2 1.536 6.272 4.736 6.784zM800.256 517.76c0 3.2 2.56 5.888 5.888 5.888h53.504c3.2 0 5.888-2.56 5.888-5.888 0-3.2-2.56-5.888-5.888-5.888h-53.504c-3.328 0-5.888 2.56-5.888 5.888zM802.688 471.04l52.736-9.344c3.2-0.512 5.376-3.584 4.736-6.784-0.512-3.2-3.584-5.376-6.784-4.736l-52.736 9.344c-3.2 0.512-5.376 3.584-4.736 6.784 0.512 3.2 3.584 5.248 6.784 4.736zM790.272 419.84l50.304-18.304c3.072-1.152 4.608-4.48 3.456-7.552-1.152-3.072-4.48-4.608-7.552-3.456l-50.304 18.304c-3.072 1.152-4.608 4.48-3.456 7.552 1.152 2.944 4.48 4.608 7.552 3.456zM769.152 371.584l46.336-26.752c2.816-1.664 3.712-5.248 2.176-7.936-1.664-2.816-5.248-3.712-8.064-2.176l-46.336 26.752c-2.816 1.664-3.712 5.248-2.176 8.064 1.664 2.688 5.248 3.712 8.064 2.048zM739.84 327.808l40.96-34.432c2.432-2.048 2.816-5.76 0.768-8.192-2.048-2.432-5.76-2.816-8.192-0.768l-40.96 34.432c-2.432 2.048-2.816 5.76-0.768 8.192 2.048 2.56 5.76 2.816 8.192 0.768zM703.488 289.664l34.432-40.96c2.048-2.432 1.792-6.144-0.768-8.192-2.432-2.048-6.144-1.792-8.192 0.768l-34.432 40.96c-2.048 2.432-1.792 6.144 0.768 8.192 2.432 2.048 6.144 1.792 8.192-0.768zM661.12 258.56l26.752-46.336c1.664-2.816 0.64-6.4-2.176-7.936-2.816-1.664-6.4-0.64-8.064 2.176l-26.752 46.336c-1.664 2.816-0.64 6.4 2.176 7.936 2.816 1.536 6.4 0.64 8.064-2.176zM613.888 235.136l18.304-50.304c1.152-3.072-0.512-6.4-3.456-7.552-3.072-1.152-6.4 0.512-7.552 3.456L602.88 231.168c-1.152 3.072 0.512 6.4 3.456 7.552 3.072 1.024 6.4-0.512 7.552-3.584zM556.544 225.152c3.2 0.512 6.272-1.536 6.784-4.736l9.344-52.736c0.512-3.2-1.536-6.272-4.736-6.784-3.2-0.512-6.272 1.536-6.784 4.736l-9.344 52.736c-0.512 3.2 1.536 6.144 4.736 6.784zM273.536 290.432c2.432 2.432 6.528 2.432 8.96 0 2.432-2.432 2.432-6.528 0-8.96l-21.12-21.12c-2.432-2.432-6.528-2.432-8.96 0-2.432 2.432-2.432 6.528 0 8.96l21.12 21.12zM237.824 333.824c2.944 2.048 6.912 1.28 8.832-1.536 2.048-2.944 1.28-6.912-1.536-8.832l-24.448-17.152c-2.944-2.048-6.912-1.28-8.832 1.536s-1.28 6.912 1.536 8.832l24.448 17.152zM183.04 370.176l27.136 12.672c3.2 1.536 7.04 0.128 8.448-3.072 1.536-3.2 0.128-7.04-3.072-8.448l-27.136-12.672c-3.2-1.536-7.04-0.128-8.448 3.072-1.536 3.2-0.128 7.04 3.072 8.448zM194.688 423.68l-28.928-7.68c-3.456-0.896-6.912 1.152-7.808 4.48-0.896 3.456 1.152 6.912 4.48 7.808l28.928 7.68c3.456 0.896 6.912-1.152 7.808-4.48 0.896-3.456-1.152-6.912-4.48-7.808zM183.168 478.72l-29.824-2.56c-3.456-0.256-6.656 2.304-6.912 5.76-0.256 3.456 2.304 6.656 5.76 6.912l29.824 2.56c3.456 0.256 6.656-2.304 6.912-5.76 0.384-3.456-2.176-6.528-5.76-6.912zM181.504 535.04l-29.824 2.56c-3.456 0.256-6.144 3.456-5.76 6.912 0.256 3.456 3.456 6.144 6.912 5.76l29.824-2.56c3.456-0.256 6.144-3.456 5.76-6.912-0.256-3.456-3.328-6.016-6.912-5.76zM191.36 590.72l-28.928 7.68c-3.456 0.896-5.376 4.352-4.48 7.808 0.896 3.456 4.352 5.376 7.808 4.48l28.928-7.68c3.456-0.896 5.376-4.352 4.48-7.808-0.896-3.328-4.352-5.376-7.808-4.48zM207.232 644.224l-27.136 12.672c-3.2 1.536-4.608 5.248-3.072 8.448 1.536 3.2 5.248 4.608 8.448 3.072l27.136-12.672c3.2-1.536 4.608-5.248 3.072-8.448-1.408-3.2-5.248-4.48-8.448-3.072zM233.984 693.888l-24.448 17.152c-2.944 2.048-3.584 6.016-1.536 8.832 2.048 2.944 6.016 3.584 8.832 1.536l24.448-17.152c2.944-2.048 3.584-6.016 1.536-8.832-2.048-2.944-6.016-3.584-8.832-1.536zM310.912 775.552L293.76 800c-2.048 2.944-1.28 6.912 1.536 8.832 2.944 2.048 6.912 1.28 8.832-1.536l17.152-24.448c2.048-2.944 1.28-6.912-1.536-8.832-2.816-2.048-6.912-1.408-8.832 1.536zM349.184 840.704c3.2 1.536 7.04 0.128 8.448-3.072l12.672-27.136c1.536-3.2 0.128-7.04-3.072-8.448-3.2-1.536-7.04-0.128-8.448 3.072l-12.672 27.136c-1.408 3.2-0.128 6.912 3.072 8.448zM407.808 862.72c3.456 0.896 6.912-1.152 7.808-4.48l7.68-28.928c0.896-3.456-1.152-6.912-4.48-7.808-3.456-0.896-6.912 1.152-7.808 4.48l-7.68 28.928c-0.896 3.328 1.152 6.912 4.48 7.808zM469.376 874.112c3.456 0.256 6.656-2.304 6.912-5.76l2.56-29.824c0.256-3.456-2.304-6.656-5.76-6.912-3.456-0.256-6.656 2.304-6.912 5.76l-2.56 29.824c-0.256 3.584 2.304 6.656 5.76 6.912zM522.496 839.168l2.56 29.824c0.256 3.456 3.456 6.144 6.912 5.76 3.456-0.256 6.144-3.456 5.76-6.912l-2.56-29.824c-0.256-3.456-3.456-6.144-6.912-5.76-3.456 0.256-6.016 3.328-5.76 6.912zM578.176 830.976l7.68 28.928c0.896 3.456 4.352 5.376 7.808 4.48 3.456-0.896 5.376-4.352 4.48-7.808l-7.68-28.928c-0.896-3.456-4.352-5.376-7.808-4.48-3.328 0.896-5.376 4.48-4.48 7.808zM631.68 813.312l12.672 27.136c1.536 3.2 5.248 4.608 8.448 3.072 3.2-1.536 4.608-5.248 3.072-8.448l-12.672-27.136c-1.536-3.2-5.248-4.608-8.448-3.072-3.2 1.536-4.48 5.248-3.072 8.448zM681.344 786.688l17.152 24.448c2.048 2.944 6.016 3.584 8.832 1.536 2.944-2.048 3.584-6.016 1.536-8.832l-17.152-24.448c-2.048-2.944-6.016-3.584-8.832-1.536-2.944 1.92-3.584 5.888-1.536 8.832zM725.504 751.744l21.12 21.12c2.432 2.432 6.528 2.432 8.96 0 2.432-2.432 2.432-6.528 0-8.96l-21.12-21.12c-2.432-2.432-6.528-2.432-8.96 0-2.432 2.432-2.432 6.528 0 8.96zM763.008 709.76l24.448 17.152c2.944 2.048 6.912 1.28 8.832-1.536 2.048-2.944 1.28-6.912-1.536-8.832l-24.448-17.152c-2.944-2.048-6.912-1.28-8.832 1.536-2.048 2.816-1.408 6.784 1.536 8.832zM792.576 661.888l27.136 12.672c3.2 1.536 7.04 0.128 8.448-3.072 1.536-3.2 0.128-7.04-3.072-8.448l-27.136-12.672c-3.2-1.536-7.04-0.128-8.448 3.072-1.536 3.2-0.128 6.912 3.072 8.448zM813.44 609.536l28.928 7.68c3.456 0.896 6.912-1.152 7.808-4.48 0.896-3.456-1.152-6.912-4.48-7.808l-28.928-7.68c-3.456-0.896-6.912 1.152-7.808 4.48-0.896 3.456 1.024 6.912 4.48 7.808zM824.832 554.368l29.824 2.56c3.456 0.256 6.656-2.304 6.912-5.76 0.256-3.456-2.304-6.656-5.76-6.912l-29.824-2.56c-3.456-0.256-6.656 2.304-6.912 5.76-0.256 3.584 2.304 6.656 5.76 6.912zM826.624 498.176l29.824-2.56c3.456-0.256 6.144-3.456 5.76-6.912-0.256-3.456-3.456-6.144-6.912-5.76l-29.824 2.56c-3.456 0.256-6.144 3.456-5.76 6.912 0.256 3.456 3.328 6.016 6.912 5.76zM818.432 442.368l28.928-7.68c3.456-0.896 5.376-4.352 4.48-7.808-0.896-3.456-4.352-5.376-7.808-4.48l-28.928 7.68c-3.456 0.896-5.376 4.352-4.48 7.808 0.896 3.456 4.48 5.376 7.808 4.48zM800.768 388.992l27.136-12.672c3.2-1.536 4.608-5.248 3.072-8.448-1.536-3.2-5.248-4.608-8.448-3.072l-27.136 12.672c-3.2 1.536-4.608 5.248-3.072 8.448 1.536 3.072 5.248 4.48 8.448 3.072zM774.144 339.328l24.448-17.152c2.944-2.048 3.584-6.016 1.536-8.832-2.048-2.944-6.016-3.584-8.832-1.536L766.848 328.96c-2.944 2.048-3.584 6.016-1.536 8.832 1.92 2.816 5.888 3.584 8.832 1.536zM697.216 257.664l17.152-24.448c2.048-2.944 1.28-6.912-1.536-8.832-2.944-2.048-6.912-1.28-8.832 1.536l-17.152 24.448c-2.048 2.944-1.28 6.912 1.536 8.832 2.816 2.048 6.784 1.408 8.832-1.536zM658.944 192.512c-3.2-1.536-7.04-0.128-8.448 3.072l-12.672 27.136c-1.536 3.2-0.128 7.04 3.072 8.448 3.2 1.536 7.04 0.128 8.448-3.072l12.672-27.136c1.408-3.2 0-7.04-3.072-8.448zM600.192 170.496c-3.456-0.896-6.912 1.152-7.808 4.48l-7.68 28.928c-0.896 3.456 1.152 6.912 4.48 7.808 3.456 0.896 6.912-1.152 7.808-4.48l7.68-28.928c1.024-3.328-1.024-6.912-4.48-7.808zM534.912 201.6c3.456 0.256 6.656-2.304 6.912-5.76l2.56-29.824c0.256-3.456-2.304-6.656-5.76-6.912-3.456-0.256-6.656 2.304-6.912 5.76l-2.56 29.824c-0.256 3.456 2.304 6.528 5.76 6.912zM476.032 158.464c-3.456 0.256-6.144 3.456-5.76 6.912l2.56 29.824c0.256 3.456 3.456 6.144 6.912 5.76 3.456-0.256 6.144-3.456 5.76-6.912l-2.56-29.824c-0.256-3.456-3.328-6.016-6.912-5.76zM422.144 173.312c-0.896-3.456-4.352-5.376-7.808-4.48-3.456 0.896-5.376 4.352-4.48 7.808l7.68 28.928c0.896 3.456 4.352 5.376 7.808 4.48 3.456-0.896 5.376-4.352 4.48-7.808l-7.68-28.928zM376.448 219.776l-12.672-27.136c-1.536-3.2-5.248-4.608-8.448-3.072-3.2 1.536-4.608 5.248-3.072 8.448L364.8 225.28c1.536 3.2 5.248 4.608 8.448 3.072 3.2-1.536 4.608-5.376 3.2-8.576zM316.416 253.824c2.048 2.944 6.016 3.584 8.832 1.536 2.944-2.048 3.584-6.016 1.536-8.832l-17.152-24.448c-2.048-2.944-6.016-3.584-8.832-1.536-2.944 2.048-3.584 6.016-1.536 8.832l17.152 24.448z" fill="#FFFFFF" p-id="19071"></path></svg></div><div class="link_content"><div class="link_title">Serv00搭建各种服务·部署应用前的一些准备工作</div><div class="link_desc">准备工作</div></div></a></div>
+<h2 id="正式开始"><a href="#正式开始" class="headerlink" title="正式开始"></a>正式开始</h2><p>首先在 Panel 中放行一个端口，接着按照下表 Add a New Website ：</p>
+<div class="table-container">
+<table>
+<thead>
+<tr>
+<th>Key</th>
+<th>Value</th>
+</tr>
+</thead>
+<tbody>
+<tr>
+<td>Domain</td>
+<td><code>xxx.USERNAME.serv00.net</code>（也可以把原有的 USERNAME.serv00.net 删掉后重新添加）</td>
+</tr>
+<tr>
+<td>Website Type</td>
+<td>proxy</td>
+</tr>
+<tr>
+<td>Proxy Target</td>
+<td>localhost</td>
+</tr>
+<tr>
+<td>Proxy URL</td>
+<td>留空</td>
+</tr>
+<tr>
+<td>Proxy port</td>
+<td>你准备用来部署 Alist 的端口</td>
+</tr>
+<tr>
+<td>Use HTPPS</td>
+<td>False</td>
+</tr>
+<tr>
+<td>DNS support</td>
+<td>True</td>
+</tr>
+</tbody>
+</table>
+</div>
+<p>添加完新站点后，继续点击上方的 Manage SSL certificates ，接着在出口 IP 的右侧点击 Manage ，再点击 Add certificate ：</p>
+<div class="table-container">
+<table>
+<thead>
+<tr>
+<th>Type</th>
+<th>Domain</th>
+</tr>
+</thead>
+<tbody>
+<tr>
+<td>Generate Let’s Encrypted certificate</td>
+<td>与刚刚添加的站点域名保持一致（如果是原有的 <code>USERNAME.serv00.net</code> ，可以省略此步）</td>
+</tr>
+</tbody>
+</table>
+</div>
+<p>接着SSH登入，并进入刚刚你新建的域名目录下的<code>public_html</code>路径下：<br><figure class="highlight shell"><table><tr><td class="code"><pre><span class="line"><span class="meta prompt_"># </span><span class="language-bash">使用一键命令安装 Artalk</span></span><br><span class="line">wget -O artalk-freebsd.sh https://github.com/SinzMise/artalk-deploy/raw/serv00/artalk-freebsd.sh &amp;&amp; sh artalk-freebsd.sh</span><br></pre></td></tr></table></figure></p>
+<p>在 Panel 中进入 MySQL 选项卡，使用 Add database 功能新建一个数据库。（当然Postgresql也可以，如果不要数据库就只要sqlite可以不用新建）<br><div class="tip info"><p>密码要求含有大写字母、小写字母和数字三种字符，且长度必须超过6个字符。</p>
+</div><br>接下来进入 File manager 选项卡，进入<code>~/domains/xxx.USERNAME.serv00.net/public_html</code>路径，可以看到一个名为 <code>artalk.yml</code> 的文件，右键点击，选择 View/Edit &gt; Source Editor ，进行编辑<br>这里面就只要改port和db就行，其它的能在后台设置<br>其中port改成你放行的端口<br>db是数据库设置<br>参考如下：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/msedge_1Z2sZqAP2k.70a4hbgckz.webp" alt="msedge_1Z2sZqAP2k"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>改完之后，点击 save 保存，接着回到 SSH 窗口中进行操作：</p>
+<p>测试启动 Artalk：<br><figure class="highlight shell"><table><tr><td class="code"><pre><span class="line">./artalk server</span><br></pre></td></tr></table></figure><br><div class="tip info"><p>确定运行没有问题后，按<code>Ctrl+c</code>即可停止运行。</p>
+</div></p>
+<p>由于artalk需要创建管理员账号，因此需要输入以下命令：<br><figure class="highlight shell"><table><tr><td class="code"><pre><span class="line">./artalk admin</span><br></pre></td></tr></table></figure><br>最后使用pm2启动并且管理artalk：<br><figure class="highlight shell"><table><tr><td class="code"><pre><span class="line">pm2 start &quot;./artalk server&quot; --name &quot;Artalk&quot;</span><br></pre></td></tr></table></figure></p>
+<div class="tip info"><p>同样的，你还可以使用 Cloudflared 隧道添加域名，而不选择使用 Proxy 。 </p>
+</div>
+<h2 id="收尾工作"><a href="#收尾工作" class="headerlink" title="收尾工作"></a>收尾工作</h2><p>参考教程：<br><div class="tag link"><a class="link_card" referrerPolicy="no-referrer" title="Serv00搭建各种服务·收尾工作" href="https://blog.rappit.site/2024/01/27/serv00_logs/#%E6%94%B6%E5%B0%BE%E5%B7%A5%E4%BD%9C"><div class="link_icon"><svg t="1670307855063" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="19066" width="200" height="200"><path d="M504.064 516.608m-384.256 0a384.256 384.256 0 1 0 768.512 0 384.256 384.256 0 1 0-768.512 0Z" fill="#009CF5" p-id="19068"></path><path d="M746.112 270.464L472.448 485.12l63.104 63.104L750.08 274.56c2.304-2.688-1.28-6.144-3.968-4.096z" fill="#FF4C3A" p-id="19069"></path><path d="M262.016 762.752l273.664-214.528-63.104-63.104-214.656 273.536c-2.176 2.688 1.28 6.144 4.096 4.096z" fill="#FFFFFF" p-id="19070"></path><path d="M505.216 155.136c-3.2 0-5.888 2.56-5.888 5.888v53.504c0 3.2 2.56 5.888 5.888 5.888s5.888-2.56 5.888-5.888v-53.504c-0.128-3.2-2.688-5.888-5.888-5.888zM442.368 160.512c-3.2 0.512-5.376 3.584-4.736 6.784l9.344 52.736c0.512 3.2 3.584 5.376 6.784 4.736 3.2-0.512 5.376-3.584 4.736-6.784l-9.344-52.736c-0.512-3.2-3.584-5.376-6.784-4.736zM396.288 234.368c1.152 3.072 4.48 4.608 7.552 3.456 3.072-1.152 4.608-4.48 3.456-7.552l-18.304-50.304c-1.152-3.072-4.48-4.608-7.552-3.456-3.072 1.152-4.608 4.48-3.456 7.552l18.304 50.304zM348.928 257.408c1.664 2.816 5.248 3.712 7.936 2.176s3.712-5.248 2.176-7.936l-26.752-46.336c-1.664-2.816-5.248-3.712-7.936-2.176-2.816 1.664-3.712 5.248-2.176 7.936l26.752 46.336zM306.304 288.256c2.048 2.432 5.76 2.816 8.192 0.768 2.432-2.048 2.816-5.76 0.768-8.192l-34.432-40.96c-2.048-2.432-5.76-2.816-8.192-0.768-2.432 2.048-2.816 5.76-0.768 8.192l34.432 40.96zM269.696 326.144c2.432 2.048 6.144 1.792 8.192-0.768 2.048-2.432 1.792-6.144-0.768-8.192l-40.96-34.432c-2.432-2.048-6.144-1.792-8.192 0.768-2.048 2.432-1.792 6.144 0.768 8.192l40.96 34.432zM193.792 342.912l46.336 26.752c2.816 1.664 6.4 0.64 7.936-2.176 1.664-2.816 0.64-6.4-2.176-8.064L199.552 332.8c-2.816-1.664-6.4-0.64-7.936 2.176-1.664 2.688-0.64 6.272 2.176 7.936zM168.32 399.488l50.304 18.304c3.072 1.152 6.4-0.512 7.552-3.456 1.152-3.072-0.512-6.4-3.456-7.552l-50.304-18.304c-3.072-1.152-6.4 0.512-7.552 3.456-1.152 3.072 0.384 6.4 3.456 7.552zM207.872 457.344l-52.736-9.344c-3.2-0.512-6.272 1.536-6.784 4.736-0.512 3.2 1.536 6.272 4.736 6.784l52.736 9.344c3.2 0.512 6.272-1.536 6.784-4.736 0.512-3.2-1.536-6.272-4.736-6.784zM201.984 509.568H148.48c-3.2 0-5.888 2.56-5.888 5.888 0 3.2 2.56 5.888 5.888 5.888h53.504c3.2 0 5.888-2.56 5.888-5.888 0-3.2-2.56-5.888-5.888-5.888zM205.44 562.176l-52.736 9.344c-3.2 0.512-5.376 3.584-4.736 6.784 0.512 3.2 3.584 5.376 6.784 4.736l52.736-9.344c3.2-0.512 5.376-3.584 4.736-6.784s-3.584-5.248-6.784-4.736zM217.856 613.376l-50.304 18.304c-3.072 1.152-4.608 4.48-3.456 7.552 1.152 3.072 4.48 4.608 7.552 3.456l50.304-18.304c3.072-1.152 4.608-4.48 3.456-7.552-1.152-3.072-4.48-4.608-7.552-3.456zM238.976 661.504l-46.336 26.752c-2.816 1.664-3.712 5.248-2.176 8.064 1.664 2.816 5.248 3.712 8.064 2.176l46.336-26.752c2.816-1.664 3.712-5.248 2.176-8.064-1.664-2.816-5.248-3.712-8.064-2.176zM268.16 705.408l-40.96 34.432c-2.432 2.048-2.816 5.76-0.768 8.192 2.048 2.432 5.76 2.816 8.192 0.768l40.96-34.432c2.432-2.048 2.816-5.76 0.768-8.192-1.92-2.56-5.632-2.816-8.192-0.768zM304.512 743.424l-34.432 40.96c-2.048 2.432-1.792 6.144 0.768 8.192 2.432 2.048 6.144 1.792 8.192-0.768l34.432-40.96c2.048-2.432 1.792-6.144-0.768-8.192-2.304-1.92-6.016-1.664-8.192 0.768zM347.008 774.656l-26.752 46.336c-1.664 2.816-0.64 6.4 2.176 7.936 2.816 1.664 6.4 0.64 8.064-2.176l26.752-46.336c1.664-2.816 0.64-6.4-2.176-7.936-2.816-1.536-6.4-0.64-8.064 2.176zM394.24 798.08l-18.304 50.304c-1.152 3.072 0.512 6.4 3.456 7.552 3.072 1.152 6.4-0.512 7.552-3.456l18.304-50.304c1.152-3.072-0.512-6.4-3.456-7.552-3.072-1.152-6.528 0.384-7.552 3.456zM440.192 872.32c3.2 0.512 6.272-1.536 6.784-4.736l9.344-52.736c0.512-3.2-1.536-6.272-4.736-6.784-3.2-0.512-6.272 1.536-6.784 4.736l-9.344 52.736c-0.64 3.2 1.536 6.272 4.736 6.784zM502.912 878.08c3.2 0 5.888-2.56 5.888-5.888v-53.504c0-3.2-2.56-5.888-5.888-5.888-3.2 0-5.888 2.56-5.888 5.888v53.504c0 3.2 2.688 5.888 5.888 5.888zM549.632 815.232l9.344 52.736c0.512 3.2 3.584 5.376 6.784 4.736 3.2-0.512 5.376-3.584 4.736-6.784l-9.344-52.736c-0.512-3.2-3.584-5.376-6.784-4.736-3.2 0.512-5.248 3.584-4.736 6.784zM600.832 802.816l18.304 50.304c1.152 3.072 4.48 4.608 7.552 3.456 3.072-1.152 4.608-4.48 3.456-7.552L611.84 798.72c-1.152-3.072-4.48-4.608-7.552-3.456-3.072 1.152-4.608 4.48-3.456 7.552zM649.088 781.696l26.752 46.336c1.664 2.816 5.248 3.712 8.064 2.176 2.816-1.664 3.712-5.248 2.176-8.064l-26.88-46.336c-1.664-2.816-5.248-3.712-8.064-2.176-2.816 1.664-3.712 5.248-2.048 8.064zM692.864 752.384l34.432 40.96c2.048 2.432 5.76 2.816 8.192 0.768 2.432-2.048 2.816-5.76 0.768-8.192l-34.432-40.96c-2.048-2.432-5.76-2.816-8.192-0.768-2.56 2.048-2.816 5.76-0.768 8.192zM730.88 716.032l40.96 34.432c2.432 2.048 6.144 1.792 8.192-0.768 2.048-2.432 1.792-6.144-0.768-8.192l-40.96-34.432c-2.432-2.048-6.144-1.792-8.192 0.768-1.92 2.432-1.664 6.144 0.768 8.192zM762.112 673.664l46.336 26.752c2.816 1.664 6.4 0.64 8.064-2.176 1.664-2.816 0.64-6.4-2.176-7.936L768 663.552c-2.816-1.664-6.4-0.64-8.064 2.176-1.536 2.688-0.64 6.272 2.176 7.936zM785.536 626.432l50.304 18.304c3.072 1.152 6.4-0.512 7.552-3.456 1.152-3.072-0.512-6.4-3.456-7.552l-50.304-18.304c-3.072-1.152-6.4 0.512-7.552 3.456-1.152 3.072 0.384 6.4 3.456 7.552zM800.256 575.872l52.736 9.344c3.2 0.512 6.272-1.536 6.784-4.736 0.512-3.2-1.536-6.272-4.736-6.784l-52.736-9.344c-3.2-0.512-6.272 1.536-6.784 4.736-0.512 3.2 1.536 6.272 4.736 6.784zM800.256 517.76c0 3.2 2.56 5.888 5.888 5.888h53.504c3.2 0 5.888-2.56 5.888-5.888 0-3.2-2.56-5.888-5.888-5.888h-53.504c-3.328 0-5.888 2.56-5.888 5.888zM802.688 471.04l52.736-9.344c3.2-0.512 5.376-3.584 4.736-6.784-0.512-3.2-3.584-5.376-6.784-4.736l-52.736 9.344c-3.2 0.512-5.376 3.584-4.736 6.784 0.512 3.2 3.584 5.248 6.784 4.736zM790.272 419.84l50.304-18.304c3.072-1.152 4.608-4.48 3.456-7.552-1.152-3.072-4.48-4.608-7.552-3.456l-50.304 18.304c-3.072 1.152-4.608 4.48-3.456 7.552 1.152 2.944 4.48 4.608 7.552 3.456zM769.152 371.584l46.336-26.752c2.816-1.664 3.712-5.248 2.176-7.936-1.664-2.816-5.248-3.712-8.064-2.176l-46.336 26.752c-2.816 1.664-3.712 5.248-2.176 8.064 1.664 2.688 5.248 3.712 8.064 2.048zM739.84 327.808l40.96-34.432c2.432-2.048 2.816-5.76 0.768-8.192-2.048-2.432-5.76-2.816-8.192-0.768l-40.96 34.432c-2.432 2.048-2.816 5.76-0.768 8.192 2.048 2.56 5.76 2.816 8.192 0.768zM703.488 289.664l34.432-40.96c2.048-2.432 1.792-6.144-0.768-8.192-2.432-2.048-6.144-1.792-8.192 0.768l-34.432 40.96c-2.048 2.432-1.792 6.144 0.768 8.192 2.432 2.048 6.144 1.792 8.192-0.768zM661.12 258.56l26.752-46.336c1.664-2.816 0.64-6.4-2.176-7.936-2.816-1.664-6.4-0.64-8.064 2.176l-26.752 46.336c-1.664 2.816-0.64 6.4 2.176 7.936 2.816 1.536 6.4 0.64 8.064-2.176zM613.888 235.136l18.304-50.304c1.152-3.072-0.512-6.4-3.456-7.552-3.072-1.152-6.4 0.512-7.552 3.456L602.88 231.168c-1.152 3.072 0.512 6.4 3.456 7.552 3.072 1.024 6.4-0.512 7.552-3.584zM556.544 225.152c3.2 0.512 6.272-1.536 6.784-4.736l9.344-52.736c0.512-3.2-1.536-6.272-4.736-6.784-3.2-0.512-6.272 1.536-6.784 4.736l-9.344 52.736c-0.512 3.2 1.536 6.144 4.736 6.784zM273.536 290.432c2.432 2.432 6.528 2.432 8.96 0 2.432-2.432 2.432-6.528 0-8.96l-21.12-21.12c-2.432-2.432-6.528-2.432-8.96 0-2.432 2.432-2.432 6.528 0 8.96l21.12 21.12zM237.824 333.824c2.944 2.048 6.912 1.28 8.832-1.536 2.048-2.944 1.28-6.912-1.536-8.832l-24.448-17.152c-2.944-2.048-6.912-1.28-8.832 1.536s-1.28 6.912 1.536 8.832l24.448 17.152zM183.04 370.176l27.136 12.672c3.2 1.536 7.04 0.128 8.448-3.072 1.536-3.2 0.128-7.04-3.072-8.448l-27.136-12.672c-3.2-1.536-7.04-0.128-8.448 3.072-1.536 3.2-0.128 7.04 3.072 8.448zM194.688 423.68l-28.928-7.68c-3.456-0.896-6.912 1.152-7.808 4.48-0.896 3.456 1.152 6.912 4.48 7.808l28.928 7.68c3.456 0.896 6.912-1.152 7.808-4.48 0.896-3.456-1.152-6.912-4.48-7.808zM183.168 478.72l-29.824-2.56c-3.456-0.256-6.656 2.304-6.912 5.76-0.256 3.456 2.304 6.656 5.76 6.912l29.824 2.56c3.456 0.256 6.656-2.304 6.912-5.76 0.384-3.456-2.176-6.528-5.76-6.912zM181.504 535.04l-29.824 2.56c-3.456 0.256-6.144 3.456-5.76 6.912 0.256 3.456 3.456 6.144 6.912 5.76l29.824-2.56c3.456-0.256 6.144-3.456 5.76-6.912-0.256-3.456-3.328-6.016-6.912-5.76zM191.36 590.72l-28.928 7.68c-3.456 0.896-5.376 4.352-4.48 7.808 0.896 3.456 4.352 5.376 7.808 4.48l28.928-7.68c3.456-0.896 5.376-4.352 4.48-7.808-0.896-3.328-4.352-5.376-7.808-4.48zM207.232 644.224l-27.136 12.672c-3.2 1.536-4.608 5.248-3.072 8.448 1.536 3.2 5.248 4.608 8.448 3.072l27.136-12.672c3.2-1.536 4.608-5.248 3.072-8.448-1.408-3.2-5.248-4.48-8.448-3.072zM233.984 693.888l-24.448 17.152c-2.944 2.048-3.584 6.016-1.536 8.832 2.048 2.944 6.016 3.584 8.832 1.536l24.448-17.152c2.944-2.048 3.584-6.016 1.536-8.832-2.048-2.944-6.016-3.584-8.832-1.536zM310.912 775.552L293.76 800c-2.048 2.944-1.28 6.912 1.536 8.832 2.944 2.048 6.912 1.28 8.832-1.536l17.152-24.448c2.048-2.944 1.28-6.912-1.536-8.832-2.816-2.048-6.912-1.408-8.832 1.536zM349.184 840.704c3.2 1.536 7.04 0.128 8.448-3.072l12.672-27.136c1.536-3.2 0.128-7.04-3.072-8.448-3.2-1.536-7.04-0.128-8.448 3.072l-12.672 27.136c-1.408 3.2-0.128 6.912 3.072 8.448zM407.808 862.72c3.456 0.896 6.912-1.152 7.808-4.48l7.68-28.928c0.896-3.456-1.152-6.912-4.48-7.808-3.456-0.896-6.912 1.152-7.808 4.48l-7.68 28.928c-0.896 3.328 1.152 6.912 4.48 7.808zM469.376 874.112c3.456 0.256 6.656-2.304 6.912-5.76l2.56-29.824c0.256-3.456-2.304-6.656-5.76-6.912-3.456-0.256-6.656 2.304-6.912 5.76l-2.56 29.824c-0.256 3.584 2.304 6.656 5.76 6.912zM522.496 839.168l2.56 29.824c0.256 3.456 3.456 6.144 6.912 5.76 3.456-0.256 6.144-3.456 5.76-6.912l-2.56-29.824c-0.256-3.456-3.456-6.144-6.912-5.76-3.456 0.256-6.016 3.328-5.76 6.912zM578.176 830.976l7.68 28.928c0.896 3.456 4.352 5.376 7.808 4.48 3.456-0.896 5.376-4.352 4.48-7.808l-7.68-28.928c-0.896-3.456-4.352-5.376-7.808-4.48-3.328 0.896-5.376 4.48-4.48 7.808zM631.68 813.312l12.672 27.136c1.536 3.2 5.248 4.608 8.448 3.072 3.2-1.536 4.608-5.248 3.072-8.448l-12.672-27.136c-1.536-3.2-5.248-4.608-8.448-3.072-3.2 1.536-4.48 5.248-3.072 8.448zM681.344 786.688l17.152 24.448c2.048 2.944 6.016 3.584 8.832 1.536 2.944-2.048 3.584-6.016 1.536-8.832l-17.152-24.448c-2.048-2.944-6.016-3.584-8.832-1.536-2.944 1.92-3.584 5.888-1.536 8.832zM725.504 751.744l21.12 21.12c2.432 2.432 6.528 2.432 8.96 0 2.432-2.432 2.432-6.528 0-8.96l-21.12-21.12c-2.432-2.432-6.528-2.432-8.96 0-2.432 2.432-2.432 6.528 0 8.96zM763.008 709.76l24.448 17.152c2.944 2.048 6.912 1.28 8.832-1.536 2.048-2.944 1.28-6.912-1.536-8.832l-24.448-17.152c-2.944-2.048-6.912-1.28-8.832 1.536-2.048 2.816-1.408 6.784 1.536 8.832zM792.576 661.888l27.136 12.672c3.2 1.536 7.04 0.128 8.448-3.072 1.536-3.2 0.128-7.04-3.072-8.448l-27.136-12.672c-3.2-1.536-7.04-0.128-8.448 3.072-1.536 3.2-0.128 6.912 3.072 8.448zM813.44 609.536l28.928 7.68c3.456 0.896 6.912-1.152 7.808-4.48 0.896-3.456-1.152-6.912-4.48-7.808l-28.928-7.68c-3.456-0.896-6.912 1.152-7.808 4.48-0.896 3.456 1.024 6.912 4.48 7.808zM824.832 554.368l29.824 2.56c3.456 0.256 6.656-2.304 6.912-5.76 0.256-3.456-2.304-6.656-5.76-6.912l-29.824-2.56c-3.456-0.256-6.656 2.304-6.912 5.76-0.256 3.584 2.304 6.656 5.76 6.912zM826.624 498.176l29.824-2.56c3.456-0.256 6.144-3.456 5.76-6.912-0.256-3.456-3.456-6.144-6.912-5.76l-29.824 2.56c-3.456 0.256-6.144 3.456-5.76 6.912 0.256 3.456 3.328 6.016 6.912 5.76zM818.432 442.368l28.928-7.68c3.456-0.896 5.376-4.352 4.48-7.808-0.896-3.456-4.352-5.376-7.808-4.48l-28.928 7.68c-3.456 0.896-5.376 4.352-4.48 7.808 0.896 3.456 4.48 5.376 7.808 4.48zM800.768 388.992l27.136-12.672c3.2-1.536 4.608-5.248 3.072-8.448-1.536-3.2-5.248-4.608-8.448-3.072l-27.136 12.672c-3.2 1.536-4.608 5.248-3.072 8.448 1.536 3.072 5.248 4.48 8.448 3.072zM774.144 339.328l24.448-17.152c2.944-2.048 3.584-6.016 1.536-8.832-2.048-2.944-6.016-3.584-8.832-1.536L766.848 328.96c-2.944 2.048-3.584 6.016-1.536 8.832 1.92 2.816 5.888 3.584 8.832 1.536zM697.216 257.664l17.152-24.448c2.048-2.944 1.28-6.912-1.536-8.832-2.944-2.048-6.912-1.28-8.832 1.536l-17.152 24.448c-2.048 2.944-1.28 6.912 1.536 8.832 2.816 2.048 6.784 1.408 8.832-1.536zM658.944 192.512c-3.2-1.536-7.04-0.128-8.448 3.072l-12.672 27.136c-1.536 3.2-0.128 7.04 3.072 8.448 3.2 1.536 7.04 0.128 8.448-3.072l12.672-27.136c1.408-3.2 0-7.04-3.072-8.448zM600.192 170.496c-3.456-0.896-6.912 1.152-7.808 4.48l-7.68 28.928c-0.896 3.456 1.152 6.912 4.48 7.808 3.456 0.896 6.912-1.152 7.808-4.48l7.68-28.928c1.024-3.328-1.024-6.912-4.48-7.808zM534.912 201.6c3.456 0.256 6.656-2.304 6.912-5.76l2.56-29.824c0.256-3.456-2.304-6.656-5.76-6.912-3.456-0.256-6.656 2.304-6.912 5.76l-2.56 29.824c-0.256 3.456 2.304 6.528 5.76 6.912zM476.032 158.464c-3.456 0.256-6.144 3.456-5.76 6.912l2.56 29.824c0.256 3.456 3.456 6.144 6.912 5.76 3.456-0.256 6.144-3.456 5.76-6.912l-2.56-29.824c-0.256-3.456-3.328-6.016-6.912-5.76zM422.144 173.312c-0.896-3.456-4.352-5.376-7.808-4.48-3.456 0.896-5.376 4.352-4.48 7.808l7.68 28.928c0.896 3.456 4.352 5.376 7.808 4.48 3.456-0.896 5.376-4.352 4.48-7.808l-7.68-28.928zM376.448 219.776l-12.672-27.136c-1.536-3.2-5.248-4.608-8.448-3.072-3.2 1.536-4.608 5.248-3.072 8.448L364.8 225.28c1.536 3.2 5.248 4.608 8.448 3.072 3.2-1.536 4.608-5.376 3.2-8.576zM316.416 253.824c2.048 2.944 6.016 3.584 8.832 1.536 2.944-2.048 3.584-6.016 1.536-8.832l-17.152-24.448c-2.048-2.944-6.016-3.584-8.832-1.536-2.944 2.048-3.584 6.016-1.536 8.832l17.152 24.448z" fill="#FFFFFF" p-id="19071"></path></svg></div><div class="link_content"><div class="link_title">Serv00搭建各种服务·收尾工作</div><div class="link_desc">收尾工作</div></div></a></div></p>
+]]></content>
+      <categories>
+        <category>项目折腾</category>
+      </categories>
+      <tags>
+        <tag>项目折腾</tag>
+        <tag>自建部署</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>新起点，新出发</title>
+    <url>/posts/16107/</url>
+    <content><![CDATA[<p>你好，我是小星鑫233，当然现在请叫我“SinzMise”或“Sinz”<br>这是“SinGO博客”停止更新且我更换名字的第一篇文章<br>博客的迁移，代表着原SinGO博客 和 Hexo-Theme-SinGO主题正式停止更新</p>
+<h1 id="为什么要停止更新？"><a href="#为什么要停止更新？" class="headerlink" title="为什么要停止更新？"></a>为什么要停止更新？</h1><p>1.名字改了，头像也改了 <del>（所以别叫我“小星鑫233”了。。。。）</del><br>2.原先SinGO主题bug贼多，我又没时间修（更何况我开学，虽然大部分时间都有空。。。。。说难听一点就是懒）</p>
+<p>懒得写了 <del>（其实是写一半突然忘记要后面要补充什么了。。。。）</del></p>
+]]></content>
+      <categories>
+        <category>站点折腾</category>
+      </categories>
+      <tags>
+        <tag>站点折腾</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>butterfly主题添加音乐页面（适配手机）</title>
+    <url>/posts/22945/</url>
+    <content><![CDATA[<h1 id="前言"><a href="#前言" class="headerlink" title="前言"></a>前言</h1><div class="trm-note info"><div class="trm-note-title">INFO</div><p>本博客已经更换主题</p>
+</div>
+<p>没有音乐页面怎么行，花里胡哨的都安排上，本来想摆烂直接上aplayer，<del>但考虑到我不会写样式（虽然我可以自学）</del> 所以我音乐页面用的是<a href="https://www.chuckle.top/article/3322c8a8.html">Chuckle的方案</a><br><psw>（等会为啥开头这么像<a href=https://www.chuckle.top/article/3322c8a8.html>这篇文章</a>）</psw><br>原本我是想做<a href="https://www.chuckle.top/article/eb3a4679.html">单页背景透明</a>的，但我发现单页背景透明和我博客背景冲突导致丑的一批，所以我把背景换成了渐变动画<br>以下是我之前的音乐页面：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230109/msedge_x1MaJIbBQg.2ka3d6xxnu80.webp" alt="msedge_x1MaJIbBQg"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>别问为啥是之前，这个音乐页面手机访问是这样的：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230109/Screenshot_2023-01-09-09-59-57-499_com.2sej4yl2vuw0.webp" alt="Screenshot_2023-01-09-09-59-57-499_com"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>当时我还以为是浏览器的问题，立即换成了Chrome浏览器，结果：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230109/Screenshot_2023-01-09-10-02-41-554_com.6tcc3lty2uo0.webp" alt="Screenshot_2023-01-09-10-02-41-554_com"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>（后来我用手机访问了那位大佬的音乐页面，也是一样出现这个问题，之前有人反映过这位大佬，大佬说自己去适配，<del>但我懒得适配，于是就有了这个教程</del> ）</p>
+<h1 id="教程"><a href="#教程" class="headerlink" title="教程"></a>教程</h1><div class="trm-tabs" id="教程开始"><ul class="trm-nav-tabs"><li class="trm-tab"><button type="button" data-href="#教程开始-1">1.0</button></li><li class="trm-tab active"><button type="button" data-href="#教程开始-2">2.0</button></li></ul><div class="trm-tab-contents"><div class="trm-tab-item-content" id="教程开始-1"><p><div class="trm-note info"><div class="trm-note-title">INFO</div><p>这个教程是我基于<a href="https://www.php.cn/xiazai/js/6169">https://www.php.cn/xiazai/js/6169</a> 做的适配butterfly主题的版本，但后面我发现这跟csdn里的<a href="https://blog.csdn.net/weixin_43151418/article/details/125351391">html好看的音乐播放器</a><psw>（希望csdn那篇文章的作者看完不会在意）</psw></p><br>&lt;/div&gt;</p>
+<p><div class="trm-note warning"><div class="trm-note-title">WARNING</div><p>目前博客已经弃用这个方案，改用2.0版本</p><br>&lt;/div&gt;</p>
+<ol>
+<li>新建[Blogroot]\themes\butterfly\layout\includes\page\music.pug，内容如下：<details class="folding-tag" green><summary> 点我查看代码 </summary>
+           <div class='content'>
+           <figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line">link(rel=&#x27;stylesheet&#x27; href=&#x27;/css/musics.css&#x27;)</span><br><span class="line">.player</span><br><span class="line">  .player__header</span><br><span class="line">    .player__img.player__img--absolute.slider</span><br><span class="line">      button.player__button.player__button--absolute--nw.playlist</span><br><span class="line">        img(src=&#x27;/svg/playlist.svg&#x27;, alt=&#x27;playlist-icon&#x27;)</span><br><span class="line">      button.player__button.player__button--absolute--center.play</span><br><span class="line">        img(src=&#x27;/svg/play.svg&#x27;, alt=&#x27;play-icon&#x27;)</span><br><span class="line">        img(src=&#x27;/svg/pause.svg&#x27;, alt=&#x27;pause-icon&#x27;)</span><br><span class="line">      .slider__content</span><br><span class="line">        each item in theme.musicplayer.musics</span><br><span class="line">          img.img.slider__img(src=item.image, alt=&#x27;cover&#x27;)</span><br><span class="line">    .player__controls</span><br><span class="line">      button.player__button.back</span><br><span class="line">        img.img(src=&#x27;/svg/back.svg&#x27;, alt=&#x27;back-icon&#x27;)</span><br><span class="line">      p.player__context.slider__context</span><br><span class="line">        strong.slider__title</span><br><span class="line">        span.slider__name.player__title</span><br><span class="line">      button.player__button.next</span><br><span class="line">        img.img(src=&#x27;/svg/next.svg&#x27;, alt=&#x27;next-icon&#x27;)</span><br><span class="line">      .progres</span><br><span class="line">        .progres__filled</span><br><span class="line">  ul.player__playlist.list</span><br><span class="line">    each musics in theme.musicplayer.musics</span><br><span class="line">      li.player__song</span><br><span class="line">        img.player__img.img(src=musics.image, alt=&#x27;cover&#x27;)</span><br><span class="line">        p.player__context</span><br><span class="line">          b.player__song-name=musics.name</span><br><span class="line">          span.flex</span><br><span class="line">            span.player__title=musics.author</span><br><span class="line">            span.player__song-time</span><br><span class="line">        audio.audio(src=musics.url)</span><br><span class="line">if theme.musicplayer.hitokoto</span><br><span class="line">  p#hitokoto</span><br><span class="line">    a#hitokoto_text(href=&quot;#&quot;,target=&quot;_blank&quot;) :D 获取中...</span><br><span class="line">script(src=&#x27;/js/player.js&#x27;)</span><br><span class="line">if theme.musicplayer.hitokoto</span><br><span class="line">  script.</span><br><span class="line">    fetch(&#x27;https://v1.hitokoto.cn&#x27;)</span><br><span class="line">      .then(response =&gt; response.json())</span><br><span class="line">      .then(data =&gt; &#123;</span><br><span class="line">        const hitokoto = document.querySelector(&#x27;#hitokoto_text&#x27;)</span><br><span class="line">        hitokoto.href = `https://hitokoto.cn/?uuid=$&#123;data.uuid&#125;`</span><br><span class="line">        hitokoto.innerText = data.hitokoto + &quot; —— &quot; + data.creator + &quot;「&quot; + data.from + &quot;」&quot;</span><br><span class="line">      &#125;)</span><br><span class="line">      .catch(console.error)</span><br></pre></td></tr></table></figure>
+           </div>
+         </details></li>
+<li>在[blogroot]\themes\butterfly\source\css\目录下新建musics.css,内容如下：<details class="folding-tag" green><summary> 点我查看代码 </summary>
+           <div class='content'>
+           <figure class="highlight css"><table><tr><td class="code"><pre><span class="line">::root &#123;</span><br><span class="line">    <span class="attr">--parent-height</span> : <span class="number">20em</span> ;</span><br><span class="line">    <span class="attr">--duration</span>: <span class="number">1s</span> ;</span><br><span class="line">    <span class="attr">--duration-text-wrap</span>: <span class="number">12s</span> <span class="number">1.5s</span> <span class="built_in">cubic-bezier</span>(<span class="number">0.82</span>, <span class="number">0.82</span>, <span class="number">1</span>, <span class="number">1.01</span>) ;</span><br><span class="line">    <span class="attr">--cubic-header</span>: <span class="built_in">var</span>(--duration) <span class="built_in">cubic-bezier</span>(<span class="number">0.71</span>, <span class="number">0.21</span>, <span class="number">0.3</span>, <span class="number">0.95</span>) ;</span><br><span class="line">    <span class="attr">--cubic-slider</span> : <span class="built_in">var</span>(--duration) <span class="built_in">cubic-bezier</span>(<span class="number">0.4</span>, <span class="number">0</span>, <span class="number">0.2</span>, <span class="number">1</span>) ;</span><br><span class="line">    <span class="attr">--cubic-play-list</span> : .<span class="number">35s</span> <span class="built_in">var</span>(--duration) <span class="built_in">cubic-bezier</span>(<span class="number">0</span>, <span class="number">0.85</span>, <span class="number">0.11</span>, <span class="number">1.64</span>) ;</span><br><span class="line">    <span class="attr">--cubic-slider-context</span> : <span class="built_in">cubic-bezier</span>(<span class="number">1</span>, -<span class="number">0.01</span>, <span class="number">1</span>, <span class="number">1.01</span>) ; </span><br><span class="line">&#125;</span><br><span class="line"><span class="selector-class">.img</span> &#123;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">100%</span> ;</span><br><span class="line">    <span class="attribute">display</span>: block ;</span><br><span class="line">    <span class="attribute">object-fit</span>: cover ;</span><br><span class="line">&#125;</span><br><span class="line"><span class="selector-class">.list</span> &#123;</span><br><span class="line">    <span class="attribute">margin</span>: <span class="number">0</span> ;</span><br><span class="line">    <span class="attribute">padding</span>: <span class="number">0</span> ;</span><br><span class="line">    <span class="attribute">list-style-type</span>: none ;</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.flex</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">display</span>: flex ;</span><br><span class="line">    <span class="attribute">align-items</span>: center ;</span><br><span class="line">    <span class="attribute">justify-content</span>: space-between ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.uppercase</span>&#123;</span><br><span class="line">  </span><br><span class="line">    <span class="attribute">text-transform</span>: uppercase ;</span><br><span class="line">  </span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.player</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">width</span>: <span class="number">17.15em</span> ;</span><br><span class="line">    <span class="attribute">display</span>: flex ;</span><br><span class="line">    <span class="attribute">overflow</span>: hidden ;</span><br><span class="line">    <span class="attribute">font-size</span>: <span class="number">1.22em</span> ;</span><br><span class="line">    <span class="attribute">border-radius</span>: <span class="number">1.35em</span> ;</span><br><span class="line">    <span class="attribute">flex-direction</span>: column ;</span><br><span class="line">    <span class="attribute">background-color</span>: white ;</span><br><span class="line">    <span class="attribute">height</span>: <span class="built_in">var</span>(--parent-height) ;</span><br><span class="line">    <span class="attribute">margin</span>:<span class="number">0</span> auto ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.player__header</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">z-index</span>: <span class="number">1</span> ;</span><br><span class="line">    <span class="attribute">gap</span>: <span class="number">0</span> .<span class="number">4em</span> ;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">100%</span> ;</span><br><span class="line">    <span class="attribute">display</span>: flex;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">5.85em</span> ;</span><br><span class="line">    <span class="attribute">flex-shrink</span>: <span class="number">0</span> ;</span><br><span class="line">    <span class="attribute">position</span>: relative;</span><br><span class="line">    <span class="attribute">align-items</span>: flex-start ;</span><br><span class="line">    <span class="attribute">border-radius</span>: inherit ;</span><br><span class="line">    <span class="attribute">justify-content</span>: flex-end ;</span><br><span class="line">    <span class="attribute">background-color</span>: white  ;</span><br><span class="line">    <span class="attribute">padding</span>: .<span class="number">95em</span> <span class="number">0.6em</span> <span class="number">0</span> <span class="number">1.2em</span> ;</span><br><span class="line">    <span class="attribute">box-shadow</span>: <span class="number">0</span> <span class="number">2px</span> <span class="number">6px</span> <span class="number">1px</span> <span class="number">#0000001f</span> ;</span><br><span class="line">    <span class="attribute">transition</span>: height <span class="built_in">var</span>(--cubic-header), box-shadow <span class="built_in">var</span>(--duration), padding <span class="built_in">var</span>(--duration) ease-in-out ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.player__header</span><span class="selector-class">.open-header</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">height</span>: <span class="number">100%</span> ;</span><br><span class="line">    <span class="attribute">padding-left</span>: <span class="number">0</span> ;</span><br><span class="line">    <span class="attribute">padding-right</span>: <span class="number">0</span> ;</span><br><span class="line">    <span class="attribute">box-shadow</span>: unset ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.player__img</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">width</span>: <span class="number">3.2em</span> ;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">3.2em</span> ;</span><br><span class="line">    <span class="attribute">border-radius</span>: <span class="number">1.32em</span> ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.player__img--absolute</span> &#123;</span><br><span class="line">  </span><br><span class="line">    <span class="attribute">top</span>: <span class="number">1.4em</span> ;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">1.2em</span> ;</span><br><span class="line">    <span class="attribute">position</span>: absolute ;</span><br><span class="line">    </span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.slider</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">flex-shrink</span>: <span class="number">0</span> ;</span><br><span class="line">    <span class="attribute">overflow</span>: hidden ;</span><br><span class="line">    <span class="attribute">transition</span>: width <span class="built_in">var</span>(--cubic-header), height <span class="built_in">var</span>(--cubic-header), top <span class="built_in">var</span>(--cubic-header), left <span class="built_in">var</span>(--cubic-header);</span><br><span class="line">    </span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.slider</span><span class="selector-class">.open-slider</span>&#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span> ;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">0</span> ;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">100%</span> ;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">14.6em</span> ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.slider__content</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">display</span>: flex ;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">100%</span> ;</span><br><span class="line">    <span class="attribute">transition</span>: transform <span class="built_in">var</span>(--cubic-slider);</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.slider__img</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">filter</span>: <span class="built_in">brightness</span>(<span class="number">75%</span>) ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.slider__name</span>, </span><br><span class="line"><span class="selector-class">.slider__title</span> &#123;</span><br><span class="line">  </span><br><span class="line">    <span class="attribute">overflow</span>: hidden ;</span><br><span class="line">    <span class="attribute">white-space</span>: nowrap ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.text-wrap</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">display</span>: block ;</span><br><span class="line">    <span class="attribute">white-space</span>: pre ;</span><br><span class="line">    <span class="attribute">width</span>: fit-content ;</span><br><span class="line">    <span class="attribute">animation</span>: text-wrap <span class="built_in">var</span>(--duration-text-wrap) infinite ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="keyword">@keyframes</span> text-wrap &#123;</span><br><span class="line"></span><br><span class="line">    <span class="number">75%</span>&#123;</span><br><span class="line">      </span><br><span class="line">        <span class="attribute">transform</span>: <span class="built_in">translate3d</span>(-<span class="number">51.5%</span>, <span class="number">0</span>, <span class="number">0</span>) ;</span><br><span class="line">      </span><br><span class="line">    &#125;</span><br><span class="line"></span><br><span class="line">    <span class="number">100%</span>&#123;</span><br><span class="line">      </span><br><span class="line">        <span class="attribute">transform</span>: <span class="built_in">translate3d</span>(-<span class="number">51.5%</span>, <span class="number">0</span>, <span class="number">0</span>) ;</span><br><span class="line"></span><br><span class="line">    &#125;</span><br><span class="line">    </span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.player__button</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">all</span>: unset ;</span><br><span class="line">    <span class="attribute">z-index</span>: <span class="number">100</span> ;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">2.5em</span> ;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">2.5em</span> ;</span><br><span class="line">    <span class="attribute">cursor</span>: pointer ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.playlist</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">transform</span>: <span class="built_in">scale</span>(<span class="number">0</span>) ;</span><br><span class="line">    <span class="attribute">transition</span>: transform <span class="built_in">calc</span>(<span class="built_in">var</span>(--duration) / <span class="number">2</span>) ;</span><br><span class="line">    </span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.slider</span><span class="selector-class">.open-slider</span> <span class="selector-class">.playlist</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">transform</span>: <span class="built_in">scale</span>(<span class="number">1</span>) ;</span><br><span class="line">    <span class="attribute">transition</span>: transform <span class="built_in">var</span>(--cubic-play-list) ;</span><br><span class="line"></span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.player__button--absolute--nw</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">top</span>: <span class="number">5.5%</span> ;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">5.5%</span> ;</span><br><span class="line">    <span class="attribute">position</span>: absolute ;</span><br><span class="line">    </span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.player__button--absolute--center</span> &#123;</span><br><span class="line">    </span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span> ;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">0</span> ;</span><br><span class="line">    <span class="attribute">right</span>: <span class="number">0</span> ;</span><br><span class="line">    <span class="attribute">bottom</span>: <span class="number">0</span> ;</span><br><span class="line">    <span class="attribute">margin</span>: auto ;</span><br><span class="line">    <span class="attribute">position</span>: absolute ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-tag">img</span><span class="selector-attr">[alt =<span class="string">&quot;pause-icon&quot;</span>]</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">display</span>: none ;</span><br><span class="line">    </span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.player__controls</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">width</span>: <span class="number">77%</span> ;</span><br><span class="line">    <span class="attribute">gap</span>: .<span class="number">5em</span> <span class="number">0</span> ;</span><br><span class="line">    <span class="attribute">display</span>: flex ;</span><br><span class="line">    <span class="attribute">flex-wrap</span>: wrap ;</span><br><span class="line">    <span class="attribute">align-items</span>: center ;</span><br><span class="line">    <span class="attribute">will-change</span>: contents ;</span><br><span class="line">    <span class="attribute">align-content</span>: center ;</span><br><span class="line">    <span class="attribute">justify-content</span>: center ;</span><br><span class="line">    <span class="attribute">transition</span>: transform <span class="built_in">var</span>(--cubic-header) , width <span class="built_in">var</span>(--cubic-header) ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.player__controls</span><span class="selector-class">.move</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">width</span>: <span class="number">88%</span> ;</span><br><span class="line">    <span class="attribute">transform</span>: <span class="built_in">translate3d</span>(-<span class="number">1.1em</span> , <span class="built_in">calc</span>(<span class="built_in">var</span>(--parent-height) - <span class="number">153%</span>) , <span class="number">0</span>) ;</span><br><span class="line">    </span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.player__context</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">margin</span>: <span class="number">0</span> ;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">100%</span> ;</span><br><span class="line">    <span class="attribute">display</span>: flex ;</span><br><span class="line">    <span class="attribute">line-height</span>: <span class="number">1.8</span> ;</span><br><span class="line">    <span class="attribute">flex-direction</span>: column ;</span><br><span class="line">    <span class="attribute">justify-content</span>: center ;</span><br><span class="line">    <span class="attribute">text-transform</span>: capitalize ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.slider__context</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">width</span>: <span class="number">56.28%</span> ;</span><br><span class="line">    <span class="attribute">cursor</span>: pointer ;</span><br><span class="line">    <span class="attribute">text-align</span>: center ;</span><br><span class="line">    <span class="attribute">padding-bottom</span>: .<span class="number">2em</span> ;</span><br><span class="line">    <span class="attribute">will-change</span>: contents ;</span><br><span class="line">    <span class="attribute">transition</span>: width <span class="built_in">var</span>(--cubic-header) ;</span><br><span class="line">    <span class="attribute">animation</span>: <span class="built_in">calc</span>(<span class="built_in">var</span>(--duration) / <span class="number">2</span>) <span class="built_in">var</span>(--cubic-slider-context) ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="keyword">@keyframes</span> opacity &#123;</span><br><span class="line">   </span><br><span class="line"></span><br><span class="line">    <span class="number">0%</span> &#123;</span><br><span class="line"></span><br><span class="line">        <span class="attribute">opacity</span>: <span class="number">0</span> ;</span><br><span class="line"></span><br><span class="line">    &#125;</span><br><span class="line"></span><br><span class="line">    <span class="number">90%</span>&#123;</span><br><span class="line"></span><br><span class="line">        <span class="attribute">opacity</span>: <span class="number">1</span> ;</span><br><span class="line"></span><br><span class="line">    &#125;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.player__controls</span><span class="selector-class">.move</span> <span class="selector-class">.slider__context</span>&#123;</span><br><span class="line">    </span><br><span class="line">    <span class="attribute">width</span>: <span class="number">49.48%</span> ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.player__title</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">font-size</span>: .<span class="number">7em</span> ;</span><br><span class="line">    <span class="attribute">font-weight</span>: bold ;</span><br><span class="line">    <span class="attribute">color</span>: <span class="number">#00000086</span> ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.progres</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">width</span>: <span class="number">90%</span> ;</span><br><span class="line">    <span class="attribute">height</span>: .<span class="number">25em</span> ;</span><br><span class="line">    <span class="attribute">cursor</span>: pointer ;</span><br><span class="line">    <span class="attribute">border-radius</span>: <span class="number">1em</span> ;</span><br><span class="line">    <span class="attribute">background-color</span>: <span class="number">#e5e7ea</span> ;</span><br><span class="line">    <span class="attribute">transition</span>: width <span class="built_in">var</span>(--cubic-header) ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.player__controls</span><span class="selector-class">.move</span> <span class="selector-class">.progres</span>&#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">width</span>: <span class="number">98%</span> ;</span><br><span class="line">    </span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.progres__filled</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">width</span>: <span class="number">0%</span> ;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">100%</span> ;</span><br><span class="line">    <span class="attribute">display</span>: flex ;</span><br><span class="line">    <span class="attribute">position</span>: relative ;</span><br><span class="line">    <span class="attribute">align-items</span>: center ;</span><br><span class="line">    <span class="attribute">border-radius</span>: inherit ;</span><br><span class="line">    <span class="attribute">background-color</span>: <span class="number">#78adfe</span> ;</span><br><span class="line">    </span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.progres__filled</span><span class="selector-pseudo">::before</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">right</span>: <span class="number">0</span> ;</span><br><span class="line">    <span class="attribute">width</span>: .<span class="number">35em</span> ;</span><br><span class="line">    <span class="attribute">content</span>: <span class="string">&quot; &quot;</span> ;</span><br><span class="line">    <span class="attribute">height</span>: .<span class="number">35em</span> ;</span><br><span class="line">    <span class="attribute">border-radius</span>: <span class="number">50%</span> ;</span><br><span class="line">    <span class="attribute">position</span>: absolute ;</span><br><span class="line">    <span class="attribute">background-color</span>: <span class="number">#5781bd</span> ;</span><br><span class="line">    </span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.player__playlist</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">height</span>: <span class="number">100%</span> ;</span><br><span class="line">    <span class="attribute">overflow</span>: auto ;   </span><br><span class="line">    <span class="attribute">padding</span>: <span class="number">1.05em</span> .<span class="number">9em</span> <span class="number">0</span> <span class="number">1.2em</span> ; </span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.player__playlist</span>::-webkit-scrollbar &#123;</span><br><span class="line">    </span><br><span class="line">    <span class="attribute">width</span>: <span class="number">0</span> ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.player__song</span> &#123;</span><br><span class="line"></span><br><span class="line"><span class="comment">/*     gap: 0 .65em ; */</span></span><br><span class="line">    <span class="attribute">display</span>: flex ;</span><br><span class="line">    <span class="attribute">cursor</span>: pointer ;</span><br><span class="line">    <span class="attribute">margin-bottom</span>: .<span class="number">5em</span> ;</span><br><span class="line">    <span class="attribute">padding-bottom</span>: .<span class="number">7em</span> ;</span><br><span class="line">    <span class="attribute">border-bottom</span>: .<span class="number">1em</span> solid <span class="number">#d8d8d859</span> ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.player__song</span> <span class="selector-class">.player__context</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">line-height</span>: <span class="number">1.5</span> ;</span><br><span class="line">    <span class="attribute">margin-left</span>: .<span class="number">65em</span> ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.player__song-name</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">font-size</span>: .<span class="number">88em</span> ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.player__song-time</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">font-size</span>: .<span class="number">65em</span> ;</span><br><span class="line">    <span class="attribute">font-weight</span>: bold ;</span><br><span class="line">    <span class="attribute">color</span>: <span class="number">#00000079</span> ; </span><br><span class="line">    <span class="attribute">height</span>: fit-content ;</span><br><span class="line">    <span class="attribute">align-self</span>: flex-end ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="selector-class">.audio</span> &#123;</span><br><span class="line"></span><br><span class="line">    <span class="attribute">display</span>: none <span class="meta">!important</span> ;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"><span class="selector-class">.player__song-name</span>,<span class="selector-class">.slider__title</span>&#123;</span><br><span class="line">    <span class="attribute">color</span>:<span class="number">#000</span></span><br><span class="line">&#125;</span><br><span class="line"><span class="selector-id">#hitokoto</span>&#123;</span><br><span class="line">    <span class="attribute">text-align</span>: center;</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
+           </div>
+         </details></li>
+<li>在[blogroot]\themes\butterfly\source\js\目录下新建player.js,内容如下：<details class="folding-tag" green><summary> 点我查看代码 </summary>
+           <div class='content'>
+           <figure class="highlight js"><table><tr><td class="code"><pre><span class="line"><span class="comment">// Designed by:  Mauricio Bucardo</span></span><br><span class="line"><span class="comment">// Original image: https://dribbble.com/shots/6957353-Music-Player-Widget</span></span><br><span class="line"><span class="meta"></span></span><br><span class="line"><span class="meta">&quot;use strict&quot;</span>;</span><br><span class="line"></span><br><span class="line"></span><br><span class="line"><span class="comment">// add elemnts</span></span><br><span class="line"><span class="keyword">const</span> bgBody = [<span class="string">&quot;#e5e7e9&quot;</span>, <span class="string">&quot;#ff4545&quot;</span>, <span class="string">&quot;#f8ded3&quot;</span>, <span class="string">&quot;#ffc382&quot;</span>, <span class="string">&quot;#f5eda6&quot;</span>, <span class="string">&quot;#ffcbdc&quot;</span>, <span class="string">&quot;#dcf3f3&quot;</span>];</span><br><span class="line"><span class="keyword">const</span> body = <span class="variable language_">document</span>.<span class="property">body</span>;</span><br><span class="line"><span class="keyword">const</span> player = <span class="variable language_">document</span>.<span class="title function_">querySelector</span>(<span class="string">&quot;.player&quot;</span>);</span><br><span class="line"><span class="keyword">const</span> playerHeader = player.<span class="title function_">querySelector</span>(<span class="string">&quot;.player__header&quot;</span>);</span><br><span class="line"><span class="keyword">const</span> playerControls = player.<span class="title function_">querySelector</span>(<span class="string">&quot;.player__controls&quot;</span>);</span><br><span class="line"><span class="keyword">const</span> playerPlayList = player.<span class="title function_">querySelectorAll</span>(<span class="string">&quot;.player__song&quot;</span>);</span><br><span class="line"><span class="keyword">const</span> playerSongs = player.<span class="title function_">querySelectorAll</span>(<span class="string">&quot;.audio&quot;</span>);</span><br><span class="line"><span class="keyword">const</span> playButton = player.<span class="title function_">querySelector</span>(<span class="string">&quot;.play&quot;</span>);</span><br><span class="line"><span class="keyword">const</span> nextButton = player.<span class="title function_">querySelector</span>(<span class="string">&quot;.next&quot;</span>);</span><br><span class="line"><span class="keyword">const</span> backButton = player.<span class="title function_">querySelector</span>(<span class="string">&quot;.back&quot;</span>);</span><br><span class="line"><span class="keyword">const</span> playlistButton = player.<span class="title function_">querySelector</span>(<span class="string">&quot;.playlist&quot;</span>);</span><br><span class="line"><span class="keyword">const</span> slider = player.<span class="title function_">querySelector</span>(<span class="string">&quot;.slider&quot;</span>);</span><br><span class="line"><span class="keyword">const</span> sliderContext = player.<span class="title function_">querySelector</span>(<span class="string">&quot;.slider__context&quot;</span>);</span><br><span class="line"><span class="keyword">const</span> sliderName = sliderContext.<span class="title function_">querySelector</span>(<span class="string">&quot;.slider__name&quot;</span>);</span><br><span class="line"><span class="keyword">const</span> sliderTitle = sliderContext.<span class="title function_">querySelector</span>(<span class="string">&quot;.slider__title&quot;</span>);</span><br><span class="line"><span class="keyword">const</span> sliderContent = slider.<span class="title function_">querySelector</span>(<span class="string">&quot;.slider__content&quot;</span>);</span><br><span class="line"><span class="keyword">const</span> sliderContentLength = playerPlayList.<span class="property">length</span> - <span class="number">1</span>;</span><br><span class="line"><span class="keyword">const</span> sliderWidth = <span class="number">100</span>;</span><br><span class="line"><span class="keyword">let</span> left = <span class="number">0</span>;</span><br><span class="line"><span class="keyword">let</span> count = <span class="number">0</span>;</span><br><span class="line"><span class="keyword">let</span> song = playerSongs[count];</span><br><span class="line"><span class="keyword">let</span> isPlay = <span class="literal">false</span>;</span><br><span class="line"><span class="keyword">const</span> pauseIcon = playButton.<span class="title function_">querySelector</span>(<span class="string">&quot;img[alt = &#x27;pause-icon&#x27;]&quot;</span>);</span><br><span class="line"><span class="keyword">const</span> playIcon = playButton.<span class="title function_">querySelector</span>(<span class="string">&quot;img[alt = &#x27;play-icon&#x27;]&quot;</span>);</span><br><span class="line"><span class="keyword">const</span> progres = player.<span class="title function_">querySelector</span>(<span class="string">&quot;.progres&quot;</span>);</span><br><span class="line"><span class="keyword">const</span> progresFilled = progres.<span class="title function_">querySelector</span>(<span class="string">&quot;.progres__filled&quot;</span>);</span><br><span class="line"><span class="keyword">let</span> isMove = <span class="literal">false</span>;</span><br><span class="line"></span><br><span class="line"><span class="comment">// creat functions</span></span><br><span class="line"><span class="keyword">function</span> <span class="title function_">openPlayer</span>(<span class="params"></span>) &#123;</span><br><span class="line"></span><br><span class="line">    playerHeader.<span class="property">classList</span>.<span class="title function_">add</span>(<span class="string">&quot;open-header&quot;</span>);</span><br><span class="line">    playerControls.<span class="property">classList</span>.<span class="title function_">add</span>(<span class="string">&quot;move&quot;</span>);</span><br><span class="line">    slider.<span class="property">classList</span>.<span class="title function_">add</span>(<span class="string">&quot;open-slider&quot;</span>);</span><br><span class="line">    </span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="keyword">function</span> <span class="title function_">closePlayer</span>(<span class="params"></span>) &#123;</span><br><span class="line"></span><br><span class="line">    playerHeader.<span class="property">classList</span>.<span class="title function_">remove</span>(<span class="string">&quot;open-header&quot;</span>);</span><br><span class="line">    playerControls.<span class="property">classList</span>.<span class="title function_">remove</span>(<span class="string">&quot;move&quot;</span>);</span><br><span class="line">    slider.<span class="property">classList</span>.<span class="title function_">remove</span>(<span class="string">&quot;open-slider&quot;</span>);</span><br><span class="line">    </span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="keyword">function</span> <span class="title function_">next</span>(<span class="params"></span>) &#123;</span><br><span class="line">    </span><br><span class="line">    <span class="keyword">if</span> (count == sliderContentLength) &#123;</span><br><span class="line">        count = count;</span><br><span class="line">        <span class="keyword">return</span></span><br><span class="line">    &#125;</span><br><span class="line">    </span><br><span class="line">    left += sliderWidth;</span><br><span class="line">    left = <span class="title class_">Math</span>.<span class="title function_">min</span>(left, (sliderContentLength) * sliderWidth);</span><br><span class="line">    sliderContent.<span class="property">style</span>.<span class="property">transform</span> = <span class="string">`translate3d(-<span class="subst">$&#123;left&#125;</span>%, 0, 0)`</span>;</span><br><span class="line">    count++;</span><br><span class="line"></span><br><span class="line">    <span class="title function_">changeSliderContext</span>();</span><br><span class="line">    <span class="title function_">changeBgBody</span>();</span><br><span class="line">    <span class="title function_">selectSong</span>();</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="keyword">function</span> <span class="title function_">back</span>(<span class="params"></span>) &#123;</span><br><span class="line">    </span><br><span class="line">    <span class="keyword">if</span> (count == <span class="number">0</span>) &#123;</span><br><span class="line">        count = count</span><br><span class="line">        <span class="keyword">return</span></span><br><span class="line">    &#125;</span><br><span class="line">    </span><br><span class="line">    left -= sliderWidth;</span><br><span class="line">    left = <span class="title class_">Math</span>.<span class="title function_">max</span>(<span class="number">0</span>, left);</span><br><span class="line">    sliderContent.<span class="property">style</span>.<span class="property">transform</span> = <span class="string">`translate3d(-<span class="subst">$&#123;left&#125;</span>%, 0, 0)`</span>;</span><br><span class="line">    count--;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="keyword">function</span> <span class="title function_">changeSliderContext</span>(<span class="params"></span>) &#123;</span><br><span class="line"></span><br><span class="line">    sliderContext.<span class="property">style</span>.<span class="property">animationName</span> = <span class="string">&quot;opacity&quot;</span>;</span><br><span class="line">    </span><br><span class="line">    sliderName.<span class="property">textContent</span> = playerPlayList[count].<span class="title function_">querySelector</span>(<span class="string">&quot;.player__title&quot;</span>).<span class="property">textContent</span>;</span><br><span class="line">    sliderTitle.<span class="property">textContent</span> = playerPlayList[count].<span class="title function_">querySelector</span>(<span class="string">&quot;.player__song-name&quot;</span>).<span class="property">textContent</span>;</span><br><span class="line">    </span><br><span class="line">    <span class="keyword">if</span> (sliderName.<span class="property">textContent</span>.<span class="property">length</span> &gt; <span class="number">16</span>) &#123;</span><br><span class="line">        <span class="keyword">const</span> textWrap = <span class="variable language_">document</span>.<span class="title function_">createElement</span>(<span class="string">&quot;span&quot;</span>);</span><br><span class="line">        textWrap.<span class="property">className</span> = <span class="string">&quot;text-wrap&quot;</span>;</span><br><span class="line">        textWrap.<span class="property">innerHTML</span> = sliderName.<span class="property">textContent</span> + <span class="string">&quot;   &quot;</span> + sliderName.<span class="property">textContent</span>;  </span><br><span class="line">        sliderName.<span class="property">innerHTML</span> = <span class="string">&quot;&quot;</span>;</span><br><span class="line">        sliderName.<span class="title function_">append</span>(textWrap);</span><br><span class="line">        </span><br><span class="line">    &#125;</span><br><span class="line"></span><br><span class="line">    <span class="keyword">if</span> (sliderTitle.<span class="property">textContent</span>.<span class="property">length</span> &gt;= <span class="number">18</span>) &#123;</span><br><span class="line">        <span class="keyword">const</span> textWrap = <span class="variable language_">document</span>.<span class="title function_">createElement</span>(<span class="string">&quot;span&quot;</span>);</span><br><span class="line">        textWrap.<span class="property">className</span> = <span class="string">&quot;text-wrap&quot;</span>;</span><br><span class="line">        textWrap.<span class="property">innerHTML</span> = sliderTitle.<span class="property">textContent</span> + <span class="string">&quot;    &quot;</span> + sliderTitle.<span class="property">textContent</span>;  </span><br><span class="line">        sliderTitle.<span class="property">innerHTML</span> = <span class="string">&quot;&quot;</span>;</span><br><span class="line">        sliderTitle.<span class="title function_">append</span>(textWrap);</span><br><span class="line">    &#125;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="keyword">function</span> <span class="title function_">changeBgBody</span>(<span class="params"></span>) &#123;</span><br><span class="line">    body.<span class="property">style</span>.<span class="property">backgroundColor</span> = bgBody[count];</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="keyword">function</span> <span class="title function_">selectSong</span>(<span class="params"></span>) &#123;</span><br><span class="line"></span><br><span class="line">    song = playerSongs[count];</span><br><span class="line"></span><br><span class="line">    <span class="keyword">for</span> (<span class="keyword">const</span> item <span class="keyword">of</span> playerSongs) &#123;</span><br><span class="line"></span><br><span class="line">        <span class="keyword">if</span> (item != song) &#123;</span><br><span class="line">            item.<span class="title function_">pause</span>();</span><br><span class="line">            item.<span class="property">currentTime</span> = <span class="number">0</span>;</span><br><span class="line">        &#125;</span><br><span class="line"></span><br><span class="line">    &#125;</span><br><span class="line"></span><br><span class="line">    <span class="keyword">if</span> (isPlay) song.<span class="title function_">play</span>();</span><br><span class="line">    </span><br><span class="line">    </span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="keyword">function</span> <span class="title function_">playSong</span>(<span class="params"></span>) &#123;</span><br><span class="line"></span><br><span class="line">   </span><br><span class="line"></span><br><span class="line">    <span class="keyword">if</span> (song.<span class="property">paused</span>) &#123;</span><br><span class="line">        song.<span class="title function_">play</span>();</span><br><span class="line">        playIcon.<span class="property">style</span>.<span class="property">display</span> = <span class="string">&quot;none&quot;</span>;</span><br><span class="line">        pauseIcon.<span class="property">style</span>.<span class="property">display</span> = <span class="string">&quot;block&quot;</span>;</span><br><span class="line"></span><br><span class="line">    &#125;<span class="keyword">else</span>&#123;</span><br><span class="line">        song.<span class="title function_">pause</span>();</span><br><span class="line">        isPlay = <span class="literal">false</span>;</span><br><span class="line">        playIcon.<span class="property">style</span>.<span class="property">display</span> = <span class="string">&quot;&quot;</span>;</span><br><span class="line">        pauseIcon.<span class="property">style</span>.<span class="property">display</span> = <span class="string">&quot;&quot;</span>;</span><br><span class="line">    &#125;</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">&#125;</span><br><span class="line"></span><br><span class="line"><span class="keyword">function</span> <span class="title function_">progresUpdate</span>(<span class="params"></span>) &#123;</span><br><span class="line"></span><br><span class="line">    <span class="keyword">const</span> progresFilledWidth = (<span class="variable language_">this</span>.<span class="property">currentTime</span> / <span class="variable language_">this</span>.<span class="property">duration</span>) * <span class="number">100</span> + <span class="string">&quot;%&quot;</span>;</span><br><span class="line">    progresFilled.<span class="property">style</span>.<span class="property">width</span> = progresFilledWidth;</span><br><span class="line"></span><br><span class="line">    <span class="keyword">if</span> (<span class="variable language_">this</span>.<span class="property">duration</span> == <span class="variable language_">this</span>.<span class="property">currentTime</span>) &#123;</span><br><span class="line">        <span class="title function_">next</span>();</span><br><span class="line">    &#125;</span><br><span class="line">    <span class="keyword">if</span> (count == sliderContentLength &amp;&amp; song.<span class="property">currentTime</span> == song.<span class="property">duration</span>) &#123;</span><br><span class="line">        playIcon.<span class="property">style</span>.<span class="property">display</span> = <span class="string">&quot;block&quot;</span>;</span><br><span class="line">        pauseIcon.<span class="property">style</span>.<span class="property">display</span> = <span class="string">&quot;&quot;</span>;</span><br><span class="line">        isPlay = <span class="literal">false</span>;</span><br><span class="line">    &#125;</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="keyword">function</span> <span class="title function_">scurb</span>(<span class="params">e</span>) &#123;</span><br><span class="line"></span><br><span class="line">    <span class="comment">// If we use e.offsetX, we have trouble setting the song time, when the mousemove is running</span></span><br><span class="line">    <span class="keyword">const</span> currentTime = ( (e.<span class="property">clientX</span> - progres.<span class="title function_">getBoundingClientRect</span>().<span class="property">left</span>) / progres.<span class="property">offsetWidth</span> ) * song.<span class="property">duration</span>;</span><br><span class="line">    song.<span class="property">currentTime</span> = currentTime;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="keyword">function</span> <span class="title function_">durationSongs</span>(<span class="params"></span>) &#123;</span><br><span class="line"></span><br><span class="line">    <span class="keyword">let</span> min = <span class="built_in">parseInt</span>(<span class="variable language_">this</span>.<span class="property">duration</span> / <span class="number">60</span>);</span><br><span class="line">    <span class="keyword">if</span> (min &lt; <span class="number">10</span>) min = <span class="string">&quot;0&quot;</span> + min;</span><br><span class="line"></span><br><span class="line">    <span class="keyword">let</span> sec = <span class="built_in">parseInt</span>(<span class="variable language_">this</span>.<span class="property">duration</span> % <span class="number">60</span>);</span><br><span class="line">    <span class="keyword">if</span> (sec &lt; <span class="number">10</span>) sec = <span class="string">&quot;0&quot;</span> + sec;</span><br><span class="line">    </span><br><span class="line">    <span class="keyword">const</span> playerSongTime = <span class="string">`<span class="subst">$&#123;min&#125;</span>:<span class="subst">$&#123;sec&#125;</span>`</span>;</span><br><span class="line">    <span class="variable language_">this</span>.<span class="title function_">closest</span>(<span class="string">&quot;.player__song&quot;</span>).<span class="title function_">querySelector</span>(<span class="string">&quot;.player__song-time&quot;</span>).<span class="title function_">append</span>(playerSongTime);</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"></span><br><span class="line"><span class="title function_">changeSliderContext</span>();</span><br><span class="line"></span><br><span class="line"><span class="comment">// add events</span></span><br><span class="line">sliderContext.<span class="title function_">addEventListener</span>(<span class="string">&quot;click&quot;</span>, openPlayer);</span><br><span class="line">sliderContext.<span class="title function_">addEventListener</span>(<span class="string">&quot;animationend&quot;</span>, <span class="function">() =&gt;</span> sliderContext.<span class="property">style</span>.<span class="property">animationName</span> =<span class="string">&#x27;&#x27;</span>);</span><br><span class="line">playlistButton.<span class="title function_">addEventListener</span>(<span class="string">&quot;click&quot;</span>, closePlayer);</span><br><span class="line"></span><br><span class="line">nextButton.<span class="title function_">addEventListener</span>(<span class="string">&quot;click&quot;</span>, next);</span><br><span class="line"></span><br><span class="line">backButton.<span class="title function_">addEventListener</span>(<span class="string">&quot;click&quot;</span>, <span class="function">() =&gt;</span> &#123;</span><br><span class="line">    <span class="title function_">back</span>();</span><br><span class="line">    <span class="title function_">changeSliderContext</span>();</span><br><span class="line">    <span class="title function_">changeBgBody</span>();</span><br><span class="line">    <span class="title function_">selectSong</span>();</span><br><span class="line"></span><br><span class="line">&#125;);</span><br><span class="line"></span><br><span class="line">playButton.<span class="title function_">addEventListener</span>(<span class="string">&quot;click&quot;</span>, <span class="function">() =&gt;</span> &#123;</span><br><span class="line">    isPlay = <span class="literal">true</span>;</span><br><span class="line">    <span class="title function_">playSong</span>();</span><br><span class="line">&#125;);</span><br><span class="line"></span><br><span class="line">playerSongs.<span class="title function_">forEach</span>(<span class="function"><span class="params">song</span> =&gt;</span> &#123;</span><br><span class="line">    song.<span class="title function_">addEventListener</span>(<span class="string">&quot;loadeddata&quot;</span> , durationSongs);</span><br><span class="line">    song.<span class="title function_">addEventListener</span>(<span class="string">&quot;timeupdate&quot;</span> , progresUpdate);</span><br><span class="line">    </span><br><span class="line">&#125;);</span><br><span class="line"></span><br><span class="line">progres.<span class="title function_">addEventListener</span>(<span class="string">&quot;mousedown&quot;</span>, <span class="function">(<span class="params">e</span>) =&gt;</span> &#123;</span><br><span class="line">    <span class="title function_">scurb</span>(e);</span><br><span class="line">    isMove = <span class="literal">true</span>;</span><br><span class="line">    song.<span class="property">muted</span> = <span class="literal">true</span>;</span><br><span class="line">&#125;);</span><br><span class="line"></span><br><span class="line"><span class="variable language_">document</span>.<span class="title function_">addEventListener</span>(<span class="string">&quot;mousemove&quot;</span>, <span class="function">(<span class="params">e</span>) =&gt;</span> isMove &amp;&amp; <span class="title function_">scurb</span>(e));</span><br><span class="line"></span><br><span class="line"><span class="variable language_">document</span>.<span class="title function_">addEventListener</span>(<span class="string">&quot;mouseup&quot;</span>, <span class="function">() =&gt;</span> &#123;</span><br><span class="line">    isMove = <span class="literal">false</span></span><br><span class="line">    song.<span class="property">muted</span> = <span class="literal">false</span>;</span><br><span class="line">&#125;);</span><br><span class="line"></span><br><span class="line"><span class="variable language_">document</span>.<span class="property">ondragstart</span> = <span class="function">() =&gt;</span> &#123;</span><br><span class="line">  <span class="keyword">return</span> <span class="literal">false</span></span><br><span class="line">&#125;;</span><br></pre></td></tr></table></figure>
+           </div>
+         </details></li>
+<li>编辑[blogroot]\themes\butterfly\layout\page.pug<figure class="highlight diff"><table><tr><td class="code"><pre><span class="line">    case page.type</span><br><span class="line">      when &#x27;tags&#x27;</span><br><span class="line">        include includes/page/tags.pug</span><br><span class="line">      when &#x27;link&#x27;</span><br><span class="line">        include includes/page/flink.pug</span><br><span class="line">      when &#x27;bb&#x27;</span><br><span class="line">        include includes/page/bb.pug</span><br><span class="line">      when &#x27;categories&#x27;</span><br><span class="line">        include includes/page/categories.pug</span><br><span class="line"><span class="addition">+      when &#x27;music&#x27;</span></span><br><span class="line"><span class="addition">+        include includes/page/music.pug</span></span><br><span class="line">      default</span><br><span class="line">        include includes/page/default-page.pug</span><br></pre></td></tr></table></figure></li>
+<li>编辑[blogroot]\themes\butterfly_config.yml，在末尾添加：<figure class="highlight yml"><table><tr><td class="code"><pre><span class="line"><span class="attr">musicplayer:</span></span><br><span class="line">  <span class="attr">hitokoto:</span> <span class="literal">true</span> <span class="comment"># 一言</span></span><br><span class="line">  <span class="attr">musics:</span></span><br><span class="line">    <span class="bullet">-</span> <span class="attr">name:</span> <span class="string">&#x27;Eutopia&#x27;</span></span><br><span class="line">      <span class="attr">author:</span> <span class="string">&#x27;Yoohsic Roomz&#x27;</span></span><br><span class="line">      <span class="attr">image:</span> <span class="string">&#x27;http://p2.music.126.net/2VW7YM7You-iOyl4_smA0Q==/109951165875618375.jpg&#x27;</span></span><br><span class="line">      <span class="attr">url:</span> <span class="string">&#x27;http://music.163.com/song/media/outer/url?id=29129889.mp3&#x27;</span></span><br><span class="line">    <span class="bullet">-</span> <span class="attr">name:</span> <span class="string">&#x27;Everything&#x27;</span></span><br><span class="line">      <span class="attr">author:</span> <span class="string">&#x27;Yinyues&#x27;</span></span><br><span class="line">      <span class="attr">image:</span> <span class="string">&#x27;http://p2.music.126.net/TcxdEdzRbKrwli4fVGeSiw==/6628955604788949.jpg&#x27;</span></span><br><span class="line">      <span class="attr">url:</span> <span class="string">&#x27;http://music.163.com/song/media/outer/url?id=29544794.mp3&#x27;</span></span><br><span class="line"><span class="comment">#    - name: &#x27;歌曲名字&#x27;</span></span><br><span class="line"><span class="comment">#      author: &#x27;歌曲作者&#x27;</span></span><br><span class="line"><span class="comment">#      image: &#x27;歌曲图片&#x27;</span></span><br><span class="line"><span class="comment">#      url: &#x27;歌曲链接&#x27;</span></span><br></pre></td></tr></table></figure></li>
+<li>将svg.7z压缩包里的五个文件放在[blogroot]\themes\butterfly\source\svg 里面<div class="btns rounded grid5">
+         <a class="button" href='https://sinz.lanzouw.com/iFMmG0kjkuvg' title='（密码：gt97）'><i class='fas fa-download'></i>（密码：gt97）</a>
+       </div></li>
+<li>运行<code>hexo new page music</code></li>
+<li>编辑[blogroot]\source\music\index.md，把里面的内容替换成：<figure class="highlight markdown"><table><tr><td class="code"><pre><span class="line">---</span><br><span class="line">type: &#x27;music&#x27;</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">aside: false</span></span><br><span class="line"><span class="section">---</span></span><br></pre></td></tr></table></figure>
+</li>
+</ol></div><div class="trm-tab-item-content active" id="教程开始-2"><p><a href="/music/old/">2.0效果预览</a></p>
+<ol>
+<li>新建[Blogroot]\themes\butterfly\layout\includes\page\music.pug（有搞1.0的话直接把music.pug里面的内容全都替换成下面的内容），内容如下：<details class="folding-tag" green><summary> 点我查看代码 </summary>
+           <div class='content'>
+           <figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line">link(</span><br><span class="line">  href=&quot;/assets/css/tplayer.css&quot;</span><br><span class="line">  rel=&quot;stylesheet&quot;</span><br><span class="line">  type=&quot;text/css&quot;</span><br><span class="line">)</span><br><span class="line">link(</span><br><span class="line">  href=&quot;/assets/plugins/FontAwesome4.1/css/font-awesome.min.css&quot;</span><br><span class="line">  rel=&quot;stylesheet&quot;</span><br><span class="line">  type=&quot;text/css&quot;</span><br><span class="line">)</span><br><span class="line">script(src=&quot;/assets/js/jquery.js&quot;)</span><br><span class="line">script(src=&quot;/assets/js/jquery-ui.js&quot;)</span><br><span class="line">script(src=&quot;/assets/js/tPlayer.js&quot;)</span><br><span class="line">#t_wrapper</span><br><span class="line">  #t_cover</span><br><span class="line">    img(src=&quot;/assets/images/logo.png&quot;)</span><br><span class="line">  #t_top</span><br><span class="line">    #t_title_info</span><br><span class="line">      span.artist</span><br><span class="line">      span.title</span><br><span class="line">  #t_middle</span><br><span class="line">    #play</span><br><span class="line">    #pause.hidden</span><br><span class="line">    #t_progress.ui-corner-all.ui-slider.ui-slider-horizontal.ui-widget.ui-widget-content</span><br><span class="line">      #trackInfo</span><br><span class="line">        #error</span><br><span class="line">        #current 0:00</span><br><span class="line">        #duration 0:00</span><br><span class="line">      .ui-corner-all.ui-slider-range.ui-slider-range-min.ui-widget-header(style=&quot;width: 0%;&quot;)</span><br><span class="line">      span.ui-corner-all.ui-slider-handle.ui-state-default(style=&quot;left: 0%;&quot; tabindex=&quot;0&quot;)</span><br><span class="line">    span#prev</span><br><span class="line">    span#next</span><br><span class="line">  #t_bottom</span><br><span class="line">    #range</span><br><span class="line">      #val</span><br><span class="line">      #vol</span><br><span class="line">      #rangeVal</span><br><span class="line">    #t_pls_show.noselectpls</span><br><span class="line">#playlist</span><br><span class="line">  ul</span><br><span class="line">    each musics in theme.musicplayer.musics</span><br><span class="line">      li(</span><br><span class="line">        t_artist=musics.author</span><br><span class="line">        t_cover=musics.image</span><br><span class="line">        t_name=musics.name</span><br><span class="line">      )</span><br><span class="line">        a(href=&quot;#&quot;)=musics.name + &#x27; - &#x27; + musics.author</span><br><span class="line">        audio(preload=&quot;none&quot; src=musics.url type=&quot;audio/mp3&quot;)</span><br><span class="line">if theme.musicplayer.hitokoto</span><br><span class="line">  p#hitokoto</span><br><span class="line">    a#hitokoto_text(href=&quot;#&quot;,target=&quot;_blank&quot;,style=&quot;text-align:center;color: #fff;&quot;) :D 获取中...</span><br><span class="line">if theme.musicplayer.hitokoto</span><br><span class="line">  script.</span><br><span class="line">    fetch(&#x27;https://v1.hitokoto.cn&#x27;)</span><br><span class="line">      .then(response =&gt; response.json())</span><br><span class="line">      .then(data =&gt; &#123;</span><br><span class="line">        const hitokoto = document.querySelector(&#x27;#hitokoto_text&#x27;)</span><br><span class="line">        hitokoto.href = `https://hitokoto.cn/?uuid=$&#123;data.uuid&#125;`</span><br><span class="line">        hitokoto.innerText = data.hitokoto + &quot; —— &quot; + data.creator + &quot;「&quot; + data.from + &quot;」&quot;</span><br><span class="line">      &#125;)</span><br><span class="line">      .catch(console.error)</span><br></pre></td></tr></table></figure>
+           </div>
+         </details></li>
+<li>将下面压缩包内五个文件夹全都解压在[blogroot]\themes\butterfly\source\assets 文件夹里面<div class="btns rounded grid5">
+         <a class="button" href='https://sinz.lanzouw.com/iUJTx0krafpi' title='（密码：3r5i）'><i class='fas fa-download'></i>（密码：3r5i）</a>
+       </div>
+<div class="trm-note info"><div class="trm-note-title">INFO</div><p>1.0想升级成2.0的，下面的步骤可以不用做</p>
+</div></li>
+<li>编辑[blogroot]\themes\butterfly_config.yml，在末尾添加：<figure class="highlight yml"><table><tr><td class="code"><pre><span class="line"><span class="attr">musicplayer:</span></span><br><span class="line">  <span class="attr">hitokoto:</span> <span class="literal">true</span> <span class="comment"># 一言</span></span><br><span class="line">  <span class="attr">musics:</span></span><br><span class="line">    <span class="bullet">-</span> <span class="attr">name:</span> <span class="string">&#x27;Eutopia&#x27;</span></span><br><span class="line">      <span class="attr">author:</span> <span class="string">&#x27;Yoohsic Roomz&#x27;</span></span><br><span class="line">      <span class="attr">image:</span> <span class="string">&#x27;http://p2.music.126.net/2VW7YM7You-iOyl4_smA0Q==/109951165875618375.jpg&#x27;</span></span><br><span class="line">      <span class="attr">url:</span> <span class="string">&#x27;http://music.163.com/song/media/outer/url?id=29129889.mp3&#x27;</span></span><br><span class="line">    <span class="bullet">-</span> <span class="attr">name:</span> <span class="string">&#x27;Everything&#x27;</span></span><br><span class="line">      <span class="attr">author:</span> <span class="string">&#x27;Yinyues&#x27;</span></span><br><span class="line">      <span class="attr">image:</span> <span class="string">&#x27;http://p2.music.126.net/TcxdEdzRbKrwli4fVGeSiw==/6628955604788949.jpg&#x27;</span></span><br><span class="line">      <span class="attr">url:</span> <span class="string">&#x27;http://music.163.com/song/media/outer/url?id=29544794.mp3&#x27;</span></span><br><span class="line"><span class="comment">#    - name: &#x27;歌曲名字&#x27;</span></span><br><span class="line"><span class="comment">#      author: &#x27;歌曲作者&#x27;</span></span><br><span class="line"><span class="comment">#      image: &#x27;歌曲图片&#x27;</span></span><br><span class="line"><span class="comment">#      url: &#x27;歌曲链接&#x27;</span></span><br></pre></td></tr></table></figure></li>
+<li>运行<code>hexo new page music</code></li>
+<li>编辑[blogroot]\source\music\index.md，把里面的内容替换成：<figure class="highlight markdown"><table><tr><td class="code"><pre><span class="line">---</span><br><span class="line">type: &#x27;music&#x27;</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">aside: false</span></span><br><span class="line"><span class="section">---</span></span><br></pre></td></tr></table></figure>
+</li>
+</ol></div></div></div>
+<h1 id="TO-DO"><a href="#TO-DO" class="headerlink" title="TO DO"></a>TO DO</h1><div class='checkbox checked'><input type="checkbox" checked="checked"/>
+            <p>播放列表</p>
+            </div>
+<div class='checkbox checked'><input type="checkbox" checked="checked"/>
+            <p>适配手机端</p>
+            </div>
+<div class='checkbox'><input type="checkbox" />
+            <p>npm插件化<psw>（Akilar行为）</psw></p>
+            </div>]]></content>
+      <categories>
+        <category>站点折腾</category>
+      </categories>
+      <tags>
+        <tag>站点折腾</tag>
+        <tag>页面魔改</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>小康大佬的说说方案 ———— ispeak搭建教程</title>
+    <url>/posts/38964/</url>
+    <content><![CDATA[<h1 id="前言"><a href="#前言" class="headerlink" title="前言"></a>前言</h1><p>搞ispeak时发现ispeak更新，能自定义评论了，也就是说我之前写的<a href="https://blog.xsnet.eu.org/posts/43224/">ispeak教程</a>失效了<br>没办法我只能重新写了这篇教程</p>
+<h1 id="教程"><a href="#教程" class="headerlink" title="教程"></a>教程</h1><h2 id="后端部署"><a href="#后端部署" class="headerlink" title="后端部署"></a>后端部署</h2><h3 id="配置数据库"><a href="#配置数据库" class="headerlink" title="配置数据库"></a>配置数据库</h3><div class="trm-note info"><div class="trm-note-title">INFO</div><p>以下内容来自：<a href="https://discuss.js.org/guide/Get-MongoDB-DataBase.html">https://discuss.js.org/guide/Get-MongoDB-DataBase.html</a></p>
+</div>
+<ul>
+<li>注册<a href="https://www.mongodb.com/cloud/atlas/register">MongoDB</a>账号，注册完成后会提示你创建一个组织，并且输入一个项目昵称，选择编程语言(不选也可以)，随后点击右下角的 <code>Continue</code>(继续)，如果没有可以跟如下图执行，点击 <code>Create an Organization</code>(创建组织)<br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Organizations-Home.png" alt="Organizations-Home"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Register-Organizations.png" alt="Register-Organizations"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Create-Organization.png" alt="Create-Organization"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/New-Project.png" alt="New-Project"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Project-Name.png" alt="Project-Name"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Create-Project.png" alt="Create-Project"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Build-Database.png" alt="Build-Database"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Select-Free.png" alt="Select-Free"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/AWS-N.Virginia.png" alt="AWS-N.Virginia"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></li>
+<li>选择免费的共享数据库，随后会跳出选择地区(选择离你服务端近的即可)，点击 <code>Create Cluster</code>创建</li>
+<li>随后您需要创建数据库用户，输入用户名和密码，继续向下滚动就是添加 IP 地址，最后点击下方的 <code>Finish and Close</code>(完成并关闭)按钮</li>
+</ul>
+<div class="trm-note warning"><div class="trm-note-title">WARNING</div><p><strong>注意</strong><br>服务器部署，则填服务器公网 IP<br><code>无服务器(ServerLess)</code>ServerLess 一般都是动态 IP，你无法得到一个固定 IP，我们建议填写 <code>0.0.0.0</code></p>
+</div>
+<p><img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Add-IP.png" alt="Add IP"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<ul>
+<li>稍作等待创建好数据库即可，随后点击 <code>Connect</code>(连接)，点击选择 <code>Connect you application</code>(连接应用程序)，然后复制连接数据库字符串</li>
+</ul>
+<div class="trm-note warning"><div class="trm-note-title">WARNING</div><p><strong>注意</strong><br>需要将字符串中的 <code>&lt;password&gt;</code>替换为您在第三步创建的数据库用户密码，修改 <code>myFirstDatabase</code>为你想要的数据库名称例如:<code>Discuss</code></p>
+</div>
+<p><img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Connect.png" alt="Connect"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Get-Connect.png" alt="Get Connect"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<h3 id="部署kkapi"><a href="#部署kkapi" class="headerlink" title="部署kkapi"></a>部署kkapi</h3><div class="trm-tabs" id="部署kkapi"><ul class="trm-nav-tabs"><li class="trm-tab active"><button type="button" data-href="#部署kkapi-1">Vercel部署（推荐）</button></li><li class="trm-tab"><button type="button" data-href="#部署kkapi-2">服务器部署</button></li><li class="trm-tab"><button type="button" data-href="#部署kkapi-3">docker 部署</button></li></ul><div class="trm-tab-contents"><div class="trm-tab-item-content active" id="部署kkapi-1"><ul>
+<li>点击下方按钮，跳转至 Vercel 进行部署。<br><a href="https://vercel.com/new/clone?repository-url=https://github.com/kkfive/kkapi-open/tree/vercel"><img src="https://vercel.com/button" alt="部署到Vercel"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></a></li>
+<li>配置环境变量：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_wwcTzH8isA.10hmhosvut28.webp" alt="msedge_wwcTzH8isA"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>环境变量可能随项目的迭代而增加必填的环境变量，具体请参考<a href="https://kkapi.js.org/reference/kkapi/environment.html">官网 —— kkapi环境变量</a></li>
+<li>重新部署<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_owqMifozPi.37vcfu5vfpm0.webp" alt="msedge_owqMifozPi"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_5WUBTLL0NZ.1nl1z1a7qiqo.webp" alt="msedge_5WUBTLL0NZ"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_mMprAjHb9O.3b2527plrfg.webp" alt="msedge_mMprAjHb9O"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></li>
+<li>绑定域名（建议）<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_miAwQcdm9f.3htnm9dlllq0.webp" alt="msedge_miAwQcdm9f"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></li>
+<li>初始化账户<br>浏览器访问：<br>你刚刚复制的地址/api/user/init?userName=你想设置的账户名<br>如果不指定用户名则自动将账户名设置为admin</li>
+</ul></div><div class="trm-tab-item-content" id="部署kkapi-2"><div class="trm-note info"><div class="trm-note-title">INFO</div><p>以下内容来自：<a href="https://kkapi.js.org/guide/setup/deploy.html#%E7%AC%AC%E4%BA%8C%E7%A7%8D%E9%83%A8%E7%BD%B2%E5%A7%BF%E5%8A%BF%EF%BC%9A%E6%9C%8D%E5%8A%A1%E5%99%A8%E9%83%A8%E7%BD%B2">第二种部署姿势：服务器部署</a></p>
+</div>
+
+<ul>
+<li>克隆源代码<br><code>git clone https://ghproxy.com/https://github.com/kkfive/kkapi-open.git</code></li>
+<li>安装依赖<br><code>yarn install</code><br>如果没有<code>yarn</code>则先允许<code>npm i yarn -g</code>进行安装</li>
+<li>安装 pm2<br><code>npm i pm2 -g</code></li>
+<li>编译项目<br><code>yarn build</code></li>
+<li>配置环境变量<br>在项目目录新建文件<code>local.env</code>，将环境变量写入其中即可。例如：<figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line">PORT=3000</span><br><span class="line">DATABASE_URL=mongodb://127.0.0.1:27017/kkpaiopen?authSource=admin</span><br><span class="line">DATABASE_USER=root</span><br><span class="line">DATABASE_PASSWORD=root</span><br><span class="line"># 加密密钥 测试</span><br><span class="line">SECRETKEY=xxxxxxxxxxxxxxx</span><br></pre></td></tr></table></figure>
+其中 PORT 表示启动的端口</li>
+<li>启动项目<br><code>pm2 start pm2.json</code><br>然后通过命令<code>curl http://127.0.0.1:3000/api/user/init</code>检查是否允许成功<br><img src="https://file.acs.pw/picGo/2022/02/27/20220227101623.png" alt="image-20220227101623911"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></li>
+<li>更新项目<br>进入项目并执行一下命令<figure class="highlight bash"><table><tr><td class="code"><pre><span class="line">git pull</span><br><span class="line">yarn build</span><br><span class="line">pm2 restart pm2.json</span><br></pre></td></tr></table></figure>
+</li>
+</ul></div><div class="trm-tab-item-content" id="部署kkapi-3"><p>尚未写完</p></div></div></div>
+<h3 id="部署kkadmin"><a href="#部署kkadmin" class="headerlink" title="部署kkadmin"></a>部署kkadmin</h3><p>介绍：kkadmin是kkapi的后台，方便发布说说<br><div class="trm-note tip"><div class="trm-note-title">TIP</div><p>以下部署姿势你只需要任选其一即可，无需全部部署。</p>
+</div></p>
+<div class="trm-tabs" id="部署kkadmin"><ul class="trm-nav-tabs"><li class="trm-tab"><button type="button" data-href="#部署kkadmin-1">Vercel部署</button></li><li class="trm-tab active"><button type="button" data-href="#部署kkadmin-2">CF pages部署（推荐）</button></li><li class="trm-tab"><button type="button" data-href="#部署kkadmin-3">其他环境部署</button></li></ul><div class="trm-tab-contents"><div class="trm-tab-item-content" id="部署kkadmin-1"><div class="trm-note warning"><div class="trm-note-title">WARNING</div><p>由于构建 kkadmin 时部分依赖文件需要 nodejs16 及以上版本才可以安装，因此不能将源代码扔给 vercel 进行构建。<br>所以只能够利用 GitHub actions 构建完成后将产物扔给 vercel 进行使用</p>
+</div>
+
+<ul>
+<li>Fork这个项目：<a href="https://github.com/kkfive/kkadmin-open/">https://github.com/kkfive/kkadmin-open/</a></li>
+</ul>
+<p><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_6HMaGfN000.1csf0rae8okg.webp" alt="msedge_6HMaGfN000"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_UPsCgr2okQ.7k0gi7brxoc0.webp" alt="msedge_UPsCgr2okQ"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<ul>
+<li>配置变量<br><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_ktuszZjpej.7ftbduod9uc0.webp" alt="msedge_ktuszZjpej"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></li>
+</ul>
+<p>VITE_GLOB_API_URL（必选）<br><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_wqMbtdCCon.26m2h3r94d7k.webp" alt="msedge_wqMbtdCCon"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<ul>
+<li>构建actions</li>
+</ul>
+<p><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_yymiOm8Kek.23xjzofdum3.webp" alt="msedge_yymiOm8Kek"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_4awdNaFJGz.1rdq0mxyfhog.webp" alt="msedge_4awdNaFJGz"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_2uYyc6Qh4I.4p3ngtkhmh00.webp" alt="msedge_2uYyc6Qh4I"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<ul>
+<li>部署到Vercel<br>复制下面这个网址</li>
+</ul>
+<figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line">https://vercel.com/new/import?s=https://github.com/SinInno/kkadmin-open/tree/vercel</span><br></pre></td></tr></table></figure>
+<p>并将“SinInno”改为你Github的用户名后访问你刚刚修改的网址<br>PS：如果你Fork的这个项目有改Repository name，那么请将上面的“kkapi-open”改为你这个项目的Repository name</p>
+<p>然后直接部署</p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_GJbsx9xoOw.8zgxw8og644.webp" alt="msedge_GJbsx9xoOw"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p>部署完成后点“Go to Dashboard”，并点左上角的“Visit”</p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_Lyo0nIvIqF.d4g2uabkljk.webp" alt="msedge_Lyo0nIvIqF"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p>账号输入你之前初始化账户的账户名<br>密码请输入默认密码：123456<br>登入面板后请更改默认密码！</p></div><div class="trm-tab-item-content active" id="部署kkadmin-2"><div class="trm-note info"><div class="trm-note-title">INFO</div><p>如果你已经在 GitHub actions 部署了，那么 cf pages 部署时也可以选择 vercel 进行部署。也可以使用主干分支进行打包部署。<br>接下来的教程以使用 cf pages 构建为例介绍</p>
+</div>
+
+<ul>
+<li>fork项目（可直接fork）</li>
+<li>导入项目</li>
+</ul>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/msedge_1bV5Of8ioS.xtthsj95ytc.webp" alt="msedge_1bV5Of8ioS"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/msedge_CcnQ68DBFQ.2q893j8w72k0.webp" alt="msedge_CcnQ68DBFQ"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<ul>
+<li>配置环境变量</li>
+</ul>
+<p>环境变量参考：<a href="https://kkapi.js.org/reference/kkadmin/environment.html">官网 —— kkadmin环境变量</a></p>
+<p><img src="https://file.acs.pw/picGo/2022/02/27/20220227113526.png" alt="配置环境变量"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<ul>
+<li>等待构建完成后即可</li>
+</ul>
+<p><img src="https://file.acs.pw/picGo/2022/02/27/20220227114643.png" alt="构建中"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p></div><div class="trm-tab-item-content" id="部署kkadmin-3"><p>其他环境部署基本可以直接使用 GitHub 构建后的 vercel 进行，毕竟只是 HTML</p></div></div></div>
+<h2 id="前端配置"><a href="#前端配置" class="headerlink" title="前端配置"></a>前端配置</h2><h3 id="进入后台，查看个人ID"><a href="#进入后台，查看个人ID" class="headerlink" title="进入后台，查看个人ID"></a>进入后台，查看个人ID</h3><p><img src="https://file.acs.pw/picGo/2022/02/27/20220227131425.png" alt="查看个人ID"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<h3 id="前端引入"><a href="#前端引入" class="headerlink" title="前端引入"></a>前端引入</h3><div class="trm-note info"><div class="trm-note-title">INFO</div><p>ipseak 使用 marked 依赖和 highlight 依赖，为了减少打包体积，并没有将该依赖打包，因此需要使用 cdn 进行外部引入。</p>
+</div>
+<div class="trm-tabs" id="前端引入ispeak"><ul class="trm-nav-tabs"><li class="trm-tab"><button type="button" data-href="#前端引入ispeak-1">使用Waline</button></li><li class="trm-tab active"><button type="button" data-href="#前端引入ispeak-2">使用Twikoo</button></li><li class="trm-tab"><button type="button" data-href="#前端引入ispeak-3">使用Discuss</button></li><li class="trm-tab"><button type="button" data-href="#前端引入ispeak-4">使用Artalk</button></li></ul><div class="trm-tab-contents"><div class="trm-tab-item-content" id="前端引入ispeak-1"><ul>
+<li>在博客目录下运行<code>hexo new page speaks</code></li>
+<li>编辑[blogroot]\source\speaks\index.md，将里面的内容替换成：<figure class="highlight markdown"><table><tr><td class="code"><pre><span class="line">---</span><br><span class="line">title: 说说</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">aside: false</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&#123;% raw %&#125;</span><br><span class="line"></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">style</span>&gt;</span></span></span><br><span class="line">  .speak-footer,.wl-power&#123;</span><br><span class="line"><span class="code">    display:none;</span></span><br><span class="line"><span class="code">  &#125;</span></span><br><span class="line"><span class="code">&lt;/style&gt;</span></span><br><span class="line"><span class="code">&lt;div id=&quot;ispeak&quot;&gt;&lt;/div&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code">  rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code">  href=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code">  rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code">  href=&quot;https://npm.elemecdn.com/ispeak@4.4.0/style.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/marked/2.0.0/marked.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;!-- CSS --&gt;</span></span><br><span class="line"><span class="code">&lt;link href=&quot;https://unpkg.com/@waline/client/dist/waline.css&quot; rel=&quot;stylesheet&quot; /&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://unpkg.com/@waline/client@v2/dist/waline.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script&gt;</span></span><br><span class="line"><span class="code">    function load_ispeak() &#123;</span></span><br><span class="line"><span class="code">        setTimeout(function() &#123;</span></span><br><span class="line"><span class="code">            var HEAD = document.getElementsByTagName(&#x27;head&#x27;)[0] || document.documentElement;</span></span><br><span class="line"><span class="code">            var src = &#x27;https://cdn1.tianli0.top/npm/ispeak/ispeak.umd.js&#x27;</span></span><br><span class="line"><span class="code">            var script = document.createElement(&#x27;script&#x27;)</span></span><br><span class="line"><span class="code">            script.setAttribute(&#x27;type&#x27;,&#x27;text/javascript&#x27;)</span></span><br><span class="line"><span class="code">            script.onload = function() &#123;</span></span><br><span class="line"><span class="code">               pjax_ispeak()</span></span><br><span class="line"><span class="code">            &#125;</span></span><br><span class="line"><span class="code">            script.setAttribute(&#x27;src&#x27;, src)</span></span><br><span class="line"><span class="code">            HEAD.appendChild(script)</span></span><br><span class="line"><span class="code">        &#125;, 1);</span></span><br><span class="line"><span class="code">    &#125;;</span></span><br><span class="line"><span class="code">    function pjax_ispeak() &#123;</span></span><br><span class="line"><span class="code">        if(!document.querySelectorAll(&quot;#ispeak&quot;)[0])return;</span></span><br><span class="line"><span class="code">        ispeak</span></span><br><span class="line"><span class="code">          .init(&#123;</span></span><br><span class="line"><span class="code">            el: &#x27;#ispeak&#x27;,//不用改</span></span><br><span class="line"><span class="code">            api: &#x27;&#x27;, //填写你kkapi地址（不是kkadmin后台地址！）</span></span><br><span class="line"><span class="code">            author: &#x27;&#x27;,//填写个人ID</span></span><br><span class="line"><span class="code">            pageSize: 10,//每页speak显示的条数（建议保持默认，除非你要魔改css）</span></span><br><span class="line"><span class="code">            loading_img: &#x27;https://bu.dusays.com/2021/03/04/d2d5e983e2961.gif&#x27;,//加载动画</span></span><br><span class="line"><span class="code">            comment: function (speak) &#123;</span></span><br><span class="line"><span class="code">              const &#123; _id, title, content &#125; = speak</span></span><br><span class="line"><span class="code">              const contentSub = content.substring(0, 30)</span></span><br><span class="line"><span class="code">              Waline.init(&#123;</span></span><br><span class="line"><span class="code">                el: &#x27;.ispeak-comment&#x27;,//不用改</span></span><br><span class="line"><span class="code">                serverURL: &#x27;&#x27;,//填写你的Waline服务端地址</span></span><br><span class="line"><span class="code">                path:&#x27;/speak/info.html?q=&#x27; + _id,//不用改，除非你将上面的speak改为别的文件夹昵称</span></span><br><span class="line"><span class="code">                //后面可按照https://waline.js.org/reference/client/props.html 修改（必须放在path后面！以下为一个例子）</span></span><br><span class="line"><span class="code">                emoji: [&quot;//unpkg.com/@waline/emojis@1.0.1/weibo&quot;,&quot;https://emoji.shojo.cn/bili/src/小黄脸&quot;,&quot;//unpkg.com/@waline/emojis@1.0.1/bilibili&quot;,&quot;https://emoji.shojo.cn/bili/src/枕边童话&quot;,&quot;https://emoji.shojo.cn/bili/src/咩栗&quot;,&quot;https://emoji.shojo.cn/bili/src/呜米&quot;,&quot;https://emoji.shojo.cn/bili/src/进击的冰糖&quot;,&quot;https://emoji.shojo.cn/bili/src/冰糖IO 蜕变·闪耀&quot;,&quot;https://emoji.shojo.cn/bili/src/多多poi&quot;,&quot;https://emoji.shojo.cn/bili/src/穆小泠&quot;,&quot;https://emoji.shojo.cn/bili/src/早稻叽&quot;],// 表情包大全</span></span><br><span class="line"><span class="code">              &#125;);</span></span><br><span class="line"><span class="code">            &#125;</span></span><br><span class="line"><span class="code">          &#125;);</span></span><br><span class="line"><span class="code">    &#125;</span></span><br><span class="line"><span class="code">    load_ispeak();</span></span><br><span class="line"><span class="code">    document.addEventListener(&#x27;pjax:complete&#x27;, function () &#123;</span></span><br><span class="line"><span class="code">        pjax_ispeak();</span></span><br><span class="line"><span class="code">    &#125;);</span></span><br><span class="line"><span class="code">&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;!--建议标注末尾链接--&gt;</span></span><br><span class="line"><span class="code">&lt;p style=&quot;width: 100%;text-align: end;font-size: .75em;color: #999;margin-top: 1em;&quot;&gt;Powered by &lt;a href=&quot;https://www.antmoe.com/speak/&quot;&gt;&lt;strong&gt;iSpeak&lt;/strong&gt;&lt;/a&gt; | Comment by &lt;a href=&quot;https://discuss.js.org/&quot;&gt;&lt;strong&gt;Waline&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt; </span></span><br><span class="line"><span class="code">&#123;% endraw %&#125;</span></span><br></pre></td></tr></table></figure></li>
+<li>在[blogroot]\source\speaks\下新建info.md，内容为下：<figure class="highlight markdown"><table><tr><td class="code"><pre><span class="line">---</span><br><span class="line">title: Speak</span><br><span class="line">aside: false</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">description: 欢迎来到SinzMise的日记，快来看看SinzMise分享了什么！ # speak介绍</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&lt;!-- CSS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">link</span> <span class="attr">rel</span>=<span class="string">&quot;stylesheet&quot;</span> <span class="attr">href</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">link</span> <span class="attr">href</span>=<span class="string">&quot;https://unpkg.com/@waline/client/dist/waline.css&quot;</span> <span class="attr">rel</span>=<span class="string">&quot;stylesheet&quot;</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;content&#x27;</span>&gt;</span></span></span><br><span class="line">  <span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">src</span>=<span class="string">&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&#123;% btn &#x27;/speaks/&#x27;,查看全部,far fa-hand-point-right,block center blue larger %&#125;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">hr</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;ispeak-comment&#x27;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&lt;!-- JS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://unpkg.com/@waline/client@v2/dist/waline.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://unpkg.com/marked@4.0.18/marked.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span>&gt;</span></span></span><br><span class="line">  const searchParams = new URLSearchParams(window.location.search);</span><br><span class="line">  const speakId = searchParams.get(&#x27;q&#x27;);</span><br><span class="line">  const path = window.location.pathname;</span><br><span class="line">  const apiURL = &#x27;https://（你的api地址）/api/ispeak&#x27;;</span><br><span class="line">  const markedRender = (body, loading<span class="emphasis">_img=&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;) =&gt; &#123;</span></span><br><span class="line"><span class="emphasis">    const renderer = &#123;</span></span><br><span class="line"><span class="emphasis">      image(href, title, text) &#123;</span></span><br><span class="line"><span class="emphasis">        return `<span class="language-xml"><span class="language-javascript">&lt;a href=<span class="string">&quot;$&#123;href&#125;&quot;</span> target=<span class="string">&quot;_blank&quot;</span> data-fancybox=<span class="string">&quot;group&quot;</span> <span class="keyword">class</span>=<span class="string">&quot;fancybox&quot;</span>&gt;</span></span></span></span><br><span class="line"><span class="emphasis">            <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">speak-src</span>=<span class="string">&quot;$&#123;href&#125;&quot;</span> <span class="attr">src</span>=<span class="string">$&#123;loading_img&#125;</span> <span class="attr">alt</span>=<span class="string">&#x27;$&#123;text&#125;&#x27;</span>&gt;</span></span></span></span></span></span><br><span class="line"><span class="emphasis">            <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;/<span class="name">a</span>&gt;</span></span></span></span>`</span></span><br><span class="line"><span class="emphasis">      &#125;</span></span><br><span class="line"><span class="emphasis">    &#125;</span></span><br><span class="line"><span class="emphasis">    marked.setOptions(&#123;</span></span><br><span class="line"><span class="emphasis">      renderer: new marked.Renderer(),</span></span><br><span class="line"><span class="emphasis">      highlight: function (code) &#123;</span></span><br><span class="line"><span class="emphasis">        if (hljs) &#123;</span></span><br><span class="line"><span class="emphasis">          return hljs.highlightAuto(code).value</span></span><br><span class="line"><span class="emphasis">        &#125; else &#123;</span></span><br><span class="line"><span class="emphasis">          return code</span></span><br><span class="line"><span class="emphasis">        &#125;</span></span><br><span class="line"><span class="emphasis">      &#125;,</span></span><br><span class="line"><span class="emphasis">      pedantic: false,</span></span><br><span class="line"><span class="emphasis">      gfm: true,</span></span><br><span class="line"><span class="emphasis">      tables: true,</span></span><br><span class="line"><span class="emphasis">      breaks: true,</span></span><br><span class="line"><span class="emphasis">      sanitize: false,</span></span><br><span class="line"><span class="emphasis">      smartLists: true,</span></span><br><span class="line"><span class="emphasis">      smartypants: false,</span></span><br><span class="line"><span class="emphasis">      xhtml: false</span></span><br><span class="line"><span class="emphasis">    &#125;)</span></span><br><span class="line"><span class="emphasis">    marked.use(&#123; renderer &#125;)</span></span><br><span class="line"><span class="emphasis">    return marked.parse(body)</span></span><br><span class="line"><span class="emphasis">  &#125;</span></span><br><span class="line"><span class="emphasis">  fetch(`$&#123;apiURL&#125;/get/$&#123;speakId&#125;`)</span></span><br><span class="line"><span class="emphasis">  .then(response =&gt; response.json())</span></span><br><span class="line"><span class="emphasis">  .then(res =&gt; &#123;</span></span><br><span class="line"><span class="emphasis">    const data = res.data;</span></span><br><span class="line"><span class="emphasis">    if(data)&#123;</span></span><br><span class="line"><span class="emphasis">      const &#123;title,content&#125; = data;</span></span><br><span class="line"><span class="emphasis">      const contentSub = content.substring(0, 30);</span></span><br><span class="line"><span class="emphasis">      document.querySelector(&#x27;.content&#x27;).innerHTML = markedRender(content);</span></span><br><span class="line"><span class="emphasis">      if(title)&#123;</span></span><br><span class="line"><span class="emphasis">        document.title = title;</span></span><br><span class="line"><span class="emphasis">      &#125;</span></span><br><span class="line"><span class="emphasis">      Waline.init(&#123;</span></span><br><span class="line"><span class="emphasis">        el: &#x27;.ispeak-comment&#x27;,//不用改</span></span><br><span class="line"><span class="emphasis">        serverURL: &#x27;&#x27;,//填写你的Waline服务端地址</span></span><br><span class="line"><span class="emphasis">        path: path + &#x27;?q=&#x27; + _</span>id,//不用改</span><br><span class="line"><span class="code">        //后面可按照https://waline.js.org/reference/client/props.html 修改（必须放在path后面！以下为一个例子）</span></span><br><span class="line"><span class="code">        emoji: [&quot;//unpkg.com/@waline/emojis@1.0.1/weibo&quot;,&quot;https://emoji.shojo.cn/bili/src/小黄脸&quot;,&quot;//unpkg.com/@waline/emojis@1.0.1/bilibili&quot;,&quot;https://emoji.shojo.cn/bili/src/枕边童话&quot;,&quot;https://emoji.shojo.cn/bili/src/咩栗&quot;,&quot;https://emoji.shojo.cn/bili/src/呜米&quot;,&quot;https://emoji.shojo.cn/bili/src/进击的冰糖&quot;,&quot;https://emoji.shojo.cn/bili/src/冰糖IO 蜕变·闪耀&quot;,&quot;https://emoji.shojo.cn/bili/src/多多poi&quot;,&quot;https://emoji.shojo.cn/bili/src/穆小泠&quot;,&quot;https://emoji.shojo.cn/bili/src/早稻叽&quot;],// 表情包大全</span></span><br><span class="line"><span class="code">      &#125;);</span></span><br><span class="line"><span class="code">    &#125;</span></span><br><span class="line"><span class="code">  &#125;);</span></span><br><span class="line"><span class="code">&lt;/script&gt;</span></span><br></pre></td></tr></table></figure>
+</li>
+</ul></div><div class="trm-tab-item-content active" id="前端引入ispeak-2"><ul>
+<li>在博客目录下运行<code>hexo new page speaks</code></li>
+<li>编辑[blogroot]\source\speaks\index.md，将里面的内容替换成：<figure class="highlight markdown"><table><tr><td class="code"><pre><span class="line">---</span><br><span class="line">title: 说说</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">aside: false</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&#123;% raw %&#125;</span><br><span class="line"></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">style</span>&gt;</span></span></span><br><span class="line">  .speak-footer,.tk-footer&#123;</span><br><span class="line"><span class="code">    display:none;</span></span><br><span class="line"><span class="code">  &#125;</span></span><br><span class="line"><span class="code">&lt;/style&gt;</span></span><br><span class="line"><span class="code">&lt;div id=&quot;ispeak&quot;&gt;&lt;/div&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code">  rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code">  href=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code">  rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code">  href=&quot;https://npm.elemecdn.com/ispeak@4.4.0/style.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/marked/2.0.0/marked.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://npm.elemecdn.com/ispeak@4.4.0/ispeak.umd.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://npm.elemecdn.com/twikoo&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script&gt;</span></span><br><span class="line"><span class="code">    function load_ispeak() &#123;</span></span><br><span class="line"><span class="code">        setTimeout(function() &#123;</span></span><br><span class="line"><span class="code">            var HEAD = document.getElementsByTagName(&#x27;head&#x27;)[0] || document.documentElement;</span></span><br><span class="line"><span class="code">            var src = &#x27;https://cdn1.tianli0.top/npm/ispeak/ispeak.umd.js&#x27;</span></span><br><span class="line"><span class="code">            var script = document.createElement(&#x27;script&#x27;)</span></span><br><span class="line"><span class="code">            script.setAttribute(&#x27;type&#x27;,&#x27;text/javascript&#x27;)</span></span><br><span class="line"><span class="code">            script.onload = function() &#123;</span></span><br><span class="line"><span class="code">               pjax_ispeak()</span></span><br><span class="line"><span class="code">            &#125;</span></span><br><span class="line"><span class="code">            script.setAttribute(&#x27;src&#x27;, src)</span></span><br><span class="line"><span class="code">            HEAD.appendChild(script)</span></span><br><span class="line"><span class="code">        &#125;, 1);</span></span><br><span class="line"><span class="code">    &#125;;</span></span><br><span class="line"><span class="code">    function pjax_ispeak() &#123;</span></span><br><span class="line"><span class="code">        if(!document.querySelectorAll(&quot;#ispeak&quot;)[0])return;</span></span><br><span class="line"><span class="code">        ispeak</span></span><br><span class="line"><span class="code">          .init(&#123;</span></span><br><span class="line"><span class="code">            el: &#x27;#ispeak&#x27;,//不用改</span></span><br><span class="line"><span class="code">            api: &#x27;&#x27;, //填写你kkapi地址（不是kkadmin后台地址！）</span></span><br><span class="line"><span class="code">            author: &#x27;&#x27;,//填写个人ID</span></span><br><span class="line"><span class="code">            pageSize: 10,//每页speak显示的条数（建议保持默认，除非你要魔改css）</span></span><br><span class="line"><span class="code">            loading_img: &#x27;https://bu.dusays.com/2021/03/04/d2d5e983e2961.gif&#x27;,//加载动画</span></span><br><span class="line"><span class="code">            comment: function (speak) &#123;</span></span><br><span class="line"><span class="code">              const &#123; _id, title, content &#125; = speak</span></span><br><span class="line"><span class="code">              const contentSub = content.substring(0, 30)</span></span><br><span class="line"><span class="code">              twikoo.init(&#123;</span></span><br><span class="line"><span class="code">                envId: &#x27;&#x27;, // 腾讯云环境填 envId；Vercel 环境填地址（https://xxx.vercel.app）</span></span><br><span class="line"><span class="code">                el: &#x27;.ispeak-comment&#x27;, // 不用改</span></span><br><span class="line"><span class="code">                //region: &#x27;ap-guangzhou&#x27;, // 环境地域，默认为 ap-shanghai，腾讯云环境填 ap-shanghai 或 ap-guangzhou；Vercel 环境不填</span></span><br><span class="line"><span class="code">                path: &#x27;/speak/info.html?q=&#x27; + _id, //不用改，除非你将上面的speak改为别的文件夹昵称</span></span><br><span class="line"><span class="code">                lang: &#x27;zh-CN&#x27;, // 用于手动设定评论区语言，支持的语言列表 https://github.com/imaegoo/twikoo/blob/main/src/client/utils/i18n/index.js</span></span><br><span class="line"><span class="code">              &#125;)</span></span><br><span class="line"><span class="code">            &#125;</span></span><br><span class="line"><span class="code">          &#125;);</span></span><br><span class="line"><span class="code">    &#125;</span></span><br><span class="line"><span class="code">    load_ispeak();</span></span><br><span class="line"><span class="code">    document.addEventListener(&#x27;pjax:complete&#x27;, function () &#123;</span></span><br><span class="line"><span class="code">        pjax_ispeak();</span></span><br><span class="line"><span class="code">    &#125;);</span></span><br><span class="line"><span class="code">&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;!--建议标注末尾链接--&gt;</span></span><br><span class="line"><span class="code">&lt;p style=&quot;width: 100%;text-align: end;font-size: .75em;color: #999;margin-top: 1em;&quot;&gt;Powered by &lt;a href=&quot;https://www.antmoe.com/speak/&quot;&gt;&lt;strong&gt;iSpeak&lt;/strong&gt;&lt;/a&gt; | Comment by &lt;a href=&quot;https://twikoo.js.org/&quot;&gt;&lt;strong&gt;Twikoo&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt; </span></span><br><span class="line"><span class="code">&#123;% endraw %&#125;</span></span><br></pre></td></tr></table></figure></li>
+<li>在[blogroot]\source\speaks\下新建info.md，内容为下：<figure class="highlight markdown"><table><tr><td class="code"><pre><span class="line">---</span><br><span class="line">title: Speak</span><br><span class="line">aside: false</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">description: 欢迎来到SinzMise的日记，快来看看SinzMise分享了什么！ # speak介绍</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&lt;!-- CSS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">link</span> <span class="attr">rel</span>=<span class="string">&quot;stylesheet&quot;</span> <span class="attr">href</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;content&#x27;</span>&gt;</span></span></span><br><span class="line">  <span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">src</span>=<span class="string">&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&#123;% btn &#x27;/speaks/&#x27;,查看全部,far fa-hand-point-right,block center blue larger %&#125;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">hr</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;ispeak-comment&#x27;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&lt;!-- JS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://npm.elemecdn.com/twikoo&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://unpkg.com/marked@4.0.18/marked.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span>&gt;</span></span></span><br><span class="line">  const searchParams = new URLSearchParams(window.location.search);</span><br><span class="line">  const speakId = searchParams.get(&#x27;q&#x27;);</span><br><span class="line">  const path = window.location.pathname;</span><br><span class="line">  const apiURL = &#x27;https://（你的api地址）/api/ispeak&#x27;;</span><br><span class="line">  const markedRender = (body, loading<span class="emphasis">_img=&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;) =&gt; &#123;</span></span><br><span class="line"><span class="emphasis">    const renderer = &#123;</span></span><br><span class="line"><span class="emphasis">      image(href, title, text) &#123;</span></span><br><span class="line"><span class="emphasis">        return `<span class="language-xml"><span class="language-javascript">&lt;a href=<span class="string">&quot;$&#123;href&#125;&quot;</span> target=<span class="string">&quot;_blank&quot;</span> data-fancybox=<span class="string">&quot;group&quot;</span> <span class="keyword">class</span>=<span class="string">&quot;fancybox&quot;</span>&gt;</span></span></span></span><br><span class="line"><span class="emphasis">            <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">speak-src</span>=<span class="string">&quot;$&#123;href&#125;&quot;</span> <span class="attr">src</span>=<span class="string">$&#123;loading_img&#125;</span> <span class="attr">alt</span>=<span class="string">&#x27;$&#123;text&#125;&#x27;</span>&gt;</span></span></span></span></span></span><br><span class="line"><span class="emphasis">            <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;/<span class="name">a</span>&gt;</span></span></span></span>`</span></span><br><span class="line"><span class="emphasis">      &#125;</span></span><br><span class="line"><span class="emphasis">    &#125;</span></span><br><span class="line"><span class="emphasis">    marked.setOptions(&#123;</span></span><br><span class="line"><span class="emphasis">      renderer: new marked.Renderer(),</span></span><br><span class="line"><span class="emphasis">      highlight: function (code) &#123;</span></span><br><span class="line"><span class="emphasis">        if (hljs) &#123;</span></span><br><span class="line"><span class="emphasis">          return hljs.highlightAuto(code).value</span></span><br><span class="line"><span class="emphasis">        &#125; else &#123;</span></span><br><span class="line"><span class="emphasis">          return code</span></span><br><span class="line"><span class="emphasis">        &#125;</span></span><br><span class="line"><span class="emphasis">      &#125;,</span></span><br><span class="line"><span class="emphasis">      pedantic: false,</span></span><br><span class="line"><span class="emphasis">      gfm: true,</span></span><br><span class="line"><span class="emphasis">      tables: true,</span></span><br><span class="line"><span class="emphasis">      breaks: true,</span></span><br><span class="line"><span class="emphasis">      sanitize: false,</span></span><br><span class="line"><span class="emphasis">      smartLists: true,</span></span><br><span class="line"><span class="emphasis">      smartypants: false,</span></span><br><span class="line"><span class="emphasis">      xhtml: false</span></span><br><span class="line"><span class="emphasis">    &#125;)</span></span><br><span class="line"><span class="emphasis">    marked.use(&#123; renderer &#125;)</span></span><br><span class="line"><span class="emphasis">    return marked.parse(body)</span></span><br><span class="line"><span class="emphasis">  &#125;</span></span><br><span class="line"><span class="emphasis">  fetch(`$&#123;apiURL&#125;/get/$&#123;speakId&#125;`)</span></span><br><span class="line"><span class="emphasis">  .then(response =&gt; response.json())</span></span><br><span class="line"><span class="emphasis">  .then(res =&gt; &#123;</span></span><br><span class="line"><span class="emphasis">    const data = res.data;</span></span><br><span class="line"><span class="emphasis">    if(data)&#123;</span></span><br><span class="line"><span class="emphasis">      const &#123;title,content&#125; = data;</span></span><br><span class="line"><span class="emphasis">      const contentSub = content.substring(0, 30);</span></span><br><span class="line"><span class="emphasis">      document.querySelector(&#x27;.content&#x27;).innerHTML = markedRender(content);</span></span><br><span class="line"><span class="emphasis">      if(title)&#123;</span></span><br><span class="line"><span class="emphasis">        document.title = title;</span></span><br><span class="line"><span class="emphasis">      &#125;</span></span><br><span class="line"><span class="emphasis">      twikoo.init(&#123;</span></span><br><span class="line"><span class="emphasis">        envId: &#x27;&#x27;, // 腾讯云环境填 envId；Vercel 环境填地址（https://xxx.vercel.app）</span></span><br><span class="line"><span class="emphasis">        el: &#x27;.ispeak-comment&#x27;, // 不用改</span></span><br><span class="line"><span class="emphasis">        //region: &#x27;ap-guangzhou&#x27;, // 环境地域，默认为 ap-shanghai，腾讯云环境填 ap-shanghai 或 ap-guangzhou；Vercel 环境不填</span></span><br><span class="line"><span class="emphasis">        path: path + &#x27;?q=&#x27; + speakId, // 不用改</span></span><br><span class="line"><span class="emphasis">        lang: &#x27;zh-CN&#x27;, // 用于手动设定评论区语言，支持的语言列表 https://github.com/imaegoo/twikoo/blob/main/src/client/utils/i18n/index.js</span></span><br><span class="line"><span class="emphasis">      &#125;)</span></span><br><span class="line"><span class="emphasis">    &#125;</span></span><br><span class="line"><span class="emphasis">  &#125;);</span></span><br><span class="line"><span class="emphasis"><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span></span><br></pre></td></tr></table></figure>
+</li>
+</ul></div><div class="trm-tab-item-content" id="前端引入ispeak-3"><ul>
+<li>在博客目录下运行<code>hexo new page speaks</code></li>
+<li>编辑[blogroot]\source\speaks\index.md，将里面的内容替换成：<figure class="highlight markdown"><table><tr><td class="code"><pre><span class="line">---</span><br><span class="line">title: 说说</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">aside: false</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&#123;% raw %&#125;</span><br><span class="line"></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">style</span>&gt;</span></span></span><br><span class="line">  .speak-footer,.D-footer&#123;</span><br><span class="line"><span class="code">    display:none;</span></span><br><span class="line"><span class="code">  &#125;</span></span><br><span class="line"><span class="code">&lt;/style&gt;</span></span><br><span class="line"><span class="code">&lt;div id=&quot;ispeak&quot;&gt;&lt;/div&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code">  rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code">  href=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code">  rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code">  href=&quot;https://npm.elemecdn.com/ispeak@4.4.0/style.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/marked/2.0.0/marked.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://npm.elemecdn.com/ispeak@4.4.0/ispeak.umd.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://npm.elemecdn.com/discuss@latest/dist/discuss.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script&gt;</span></span><br><span class="line"><span class="code">    function load_ispeak() &#123;</span></span><br><span class="line"><span class="code">        setTimeout(function() &#123;</span></span><br><span class="line"><span class="code">            var HEAD = document.getElementsByTagName(&#x27;head&#x27;)[0] || document.documentElement;</span></span><br><span class="line"><span class="code">            var src = &#x27;https://cdn1.tianli0.top/npm/ispeak/ispeak.umd.js&#x27;</span></span><br><span class="line"><span class="code">            var script = document.createElement(&#x27;script&#x27;)</span></span><br><span class="line"><span class="code">            script.setAttribute(&#x27;type&#x27;,&#x27;text/javascript&#x27;)</span></span><br><span class="line"><span class="code">            script.onload = function() &#123;</span></span><br><span class="line"><span class="code">               pjax_ispeak()</span></span><br><span class="line"><span class="code">            &#125;</span></span><br><span class="line"><span class="code">            script.setAttribute(&#x27;src&#x27;, src)</span></span><br><span class="line"><span class="code">            HEAD.appendChild(script)</span></span><br><span class="line"><span class="code">        &#125;, 1);</span></span><br><span class="line"><span class="code">    &#125;;</span></span><br><span class="line"><span class="code">    function pjax_ispeak() &#123;</span></span><br><span class="line"><span class="code">        if(!document.querySelectorAll(&quot;#ispeak&quot;)[0])return;</span></span><br><span class="line"><span class="code">        ispeak</span></span><br><span class="line"><span class="code">          .init(&#123;</span></span><br><span class="line"><span class="code">            el: &#x27;#ispeak&#x27;,//不用改</span></span><br><span class="line"><span class="code">            api: &#x27;&#x27;, //填写你kkapi地址（不是kkadmin后台地址！）</span></span><br><span class="line"><span class="code">            author: &#x27;&#x27;,//填写个人ID</span></span><br><span class="line"><span class="code">            pageSize: 10,//每页speak显示的条数（建议保持默认，除非你要魔改css）</span></span><br><span class="line"><span class="code">            loading_img: &#x27;https://bu.dusays.com/2021/03/04/d2d5e983e2961.gif&#x27;,//加载动画</span></span><br><span class="line"><span class="code">            comment: function (speak) &#123;</span></span><br><span class="line"><span class="code">              const &#123; _id, title, content &#125; = speak</span></span><br><span class="line"><span class="code">              const contentSub = content.substring(0, 30)</span></span><br><span class="line"><span class="code">              discuss.init(&#123;</span></span><br><span class="line"><span class="code">                  el: &#x27;.ispeak-comment&#x27;,// 不用改</span></span><br><span class="line"><span class="code">                  serverURLs: &#x27;&#x27;,//填写你的Discuss服务端地址</span></span><br><span class="line"><span class="code">                  path: &#x27;/speak/info.html?q=&#x27; + _id,//不用改，除非你将上面的speak改为别的文件夹昵称</span></span><br><span class="line"><span class="code">                  //后面可按照https://discuss.js.org/Quick-Start.html#%E5%AE%A2%E6%88%B7%E7%AB%AF-client 修改（必须放在path后面！以下为一个例子）</span></span><br><span class="line"><span class="code">                  ph: &#x27;千山万水总是情，给个评论行不行&#x27; ,//评论框占位符</span></span><br><span class="line"><span class="code">                  imgLoading: &#x27;https://bu.dusays.com/2021/03/04/d2d5e983e2961.gif&#x27;//评论图片加载动画</span></span><br><span class="line"><span class="code">                &#125;)</span></span><br><span class="line"><span class="code">            &#125;</span></span><br><span class="line"><span class="code">          &#125;);</span></span><br><span class="line"><span class="code">    &#125;</span></span><br><span class="line"><span class="code">    load_ispeak();</span></span><br><span class="line"><span class="code">    document.addEventListener(&#x27;pjax:complete&#x27;, function () &#123;</span></span><br><span class="line"><span class="code">        pjax_ispeak();</span></span><br><span class="line"><span class="code">    &#125;);</span></span><br><span class="line"><span class="code">&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;!--建议标注末尾链接--&gt;</span></span><br><span class="line"><span class="code">&lt;p style=&quot;width: 100%;text-align: end;font-size: .75em;color: #999;margin-top: 1em;&quot;&gt;Powered by &lt;a href=&quot;https://www.antmoe.com/speak/&quot;&gt;&lt;strong&gt;iSpeak&lt;/strong&gt;&lt;/a&gt; | Comment by &lt;a href=&quot;https://discuss.js.org/&quot;&gt;&lt;strong&gt;Discuss&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt; </span></span><br><span class="line"><span class="code">&#123;% endraw %&#125;</span></span><br></pre></td></tr></table></figure></li>
+<li>在[blogroot]\source\speaks\下新建info.md，内容为下：<figure class="highlight markdown"><table><tr><td class="code"><pre><span class="line">---</span><br><span class="line">title: Speak</span><br><span class="line">aside: false</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">description: 欢迎来到SinzMise的日记，快来看看SinzMise分享了什么！ # speak介绍</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&lt;!-- CSS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">link</span> <span class="attr">rel</span>=<span class="string">&quot;stylesheet&quot;</span> <span class="attr">href</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;content&#x27;</span>&gt;</span></span></span><br><span class="line">  <span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">src</span>=<span class="string">&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&#123;% btn &#x27;/speaks/&#x27;,查看全部,far fa-hand-point-right,block center blue larger %&#125;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">hr</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;ispeak-comment&#x27;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&lt;!-- JS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://npm.elemecdn.com/discuss@latest/dist/discuss.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://unpkg.com/marked@4.0.18/marked.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span>&gt;</span></span></span><br><span class="line">  const searchParams = new URLSearchParams(window.location.search);</span><br><span class="line">  const speakId = searchParams.get(&#x27;q&#x27;);</span><br><span class="line">  const path = window.location.pathname;</span><br><span class="line">  const apiURL = &#x27;https://（你的api地址）/api/ispeak&#x27;; //api地址</span><br><span class="line">  const markedRender = (body, loading<span class="emphasis">_img=&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;) =&gt; &#123;</span></span><br><span class="line"><span class="emphasis">    const renderer = &#123;</span></span><br><span class="line"><span class="emphasis">      image(href, title, text) &#123;</span></span><br><span class="line"><span class="emphasis">        return `<span class="language-xml"><span class="language-javascript">&lt;a href=<span class="string">&quot;$&#123;href&#125;&quot;</span> target=<span class="string">&quot;_blank&quot;</span> data-fancybox=<span class="string">&quot;group&quot;</span> <span class="keyword">class</span>=<span class="string">&quot;fancybox&quot;</span>&gt;</span></span></span></span><br><span class="line"><span class="emphasis">            <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">speak-src</span>=<span class="string">&quot;$&#123;href&#125;&quot;</span> <span class="attr">src</span>=<span class="string">$&#123;loading_img&#125;</span> <span class="attr">alt</span>=<span class="string">&#x27;$&#123;text&#125;&#x27;</span>&gt;</span></span></span></span></span></span><br><span class="line"><span class="emphasis">            <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;/<span class="name">a</span>&gt;</span></span></span></span>`</span></span><br><span class="line"><span class="emphasis">      &#125;</span></span><br><span class="line"><span class="emphasis">    &#125;</span></span><br><span class="line"><span class="emphasis">    marked.setOptions(&#123;</span></span><br><span class="line"><span class="emphasis">      renderer: new marked.Renderer(),</span></span><br><span class="line"><span class="emphasis">      highlight: function (code) &#123;</span></span><br><span class="line"><span class="emphasis">        if (hljs) &#123;</span></span><br><span class="line"><span class="emphasis">          return hljs.highlightAuto(code).value</span></span><br><span class="line"><span class="emphasis">        &#125; else &#123;</span></span><br><span class="line"><span class="emphasis">          return code</span></span><br><span class="line"><span class="emphasis">        &#125;</span></span><br><span class="line"><span class="emphasis">      &#125;,</span></span><br><span class="line"><span class="emphasis">      pedantic: false,</span></span><br><span class="line"><span class="emphasis">      gfm: true,</span></span><br><span class="line"><span class="emphasis">      tables: true,</span></span><br><span class="line"><span class="emphasis">      breaks: true,</span></span><br><span class="line"><span class="emphasis">      sanitize: false,</span></span><br><span class="line"><span class="emphasis">      smartLists: true,</span></span><br><span class="line"><span class="emphasis">      smartypants: false,</span></span><br><span class="line"><span class="emphasis">      xhtml: false</span></span><br><span class="line"><span class="emphasis">    &#125;)</span></span><br><span class="line"><span class="emphasis">    marked.use(&#123; renderer &#125;)</span></span><br><span class="line"><span class="emphasis">    return marked.parse(body)</span></span><br><span class="line"><span class="emphasis">  &#125;</span></span><br><span class="line"><span class="emphasis">  fetch(`$&#123;apiURL&#125;/get/$&#123;speakId&#125;`)</span></span><br><span class="line"><span class="emphasis">  .then(response =&gt; response.json())</span></span><br><span class="line"><span class="emphasis">  .then(res =&gt; &#123;</span></span><br><span class="line"><span class="emphasis">    const data = res.data;</span></span><br><span class="line"><span class="emphasis">    if(data)&#123;</span></span><br><span class="line"><span class="emphasis">      const &#123;title,content&#125; = data;</span></span><br><span class="line"><span class="emphasis">      const contentSub = content.substring(0, 30);</span></span><br><span class="line"><span class="emphasis">      document.querySelector(&#x27;.content&#x27;).innerHTML = markedRender(content);</span></span><br><span class="line"><span class="emphasis">      if(title)&#123;</span></span><br><span class="line"><span class="emphasis">        document.title = title;</span></span><br><span class="line"><span class="emphasis">      &#125;</span></span><br><span class="line"><span class="emphasis">      discuss.init(&#123;</span></span><br><span class="line"><span class="emphasis">            el: &#x27;.ispeak-comment&#x27;,// 不用改</span></span><br><span class="line"><span class="emphasis">            serverURLs: &#x27;&#x27;,//填写你的Discuss服务端地址</span></span><br><span class="line"><span class="emphasis">            path: path + &#x27;?q=&#x27; + speakId,// 不用改</span></span><br><span class="line"><span class="emphasis">            //后面可按照https://discuss.js.org/Quick-Start.html#%E5%AE%A2%E6%88%B7%E7%AB%AF-client 修改（必须放在path后面！以下为一个例子）</span></span><br><span class="line"><span class="emphasis">            ph: &#x27;千山万水总是情，给个评论行不行&#x27; ,//评论框占位符</span></span><br><span class="line"><span class="emphasis">            imgLoading: &#x27;https://bu.dusays.com/2021/03/04/d2d5e983e2961.gif&#x27;//评论图片加载动画</span></span><br><span class="line"><span class="emphasis">          &#125;)</span></span><br><span class="line"><span class="emphasis">    &#125;</span></span><br><span class="line"><span class="emphasis">  &#125;);</span></span><br><span class="line"><span class="emphasis"><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span></span><br></pre></td></tr></table></figure>
+</li>
+</ul></div><div class="trm-tab-item-content" id="前端引入ispeak-4"><ul>
+<li>在博客目录下运行<code>hexo new page speaks</code></li>
+<li>编辑[blogroot]\source\speaks\index.md，将里面的内容替换成：<figure class="highlight markdown"><table><tr><td class="code"><pre><span class="line">---</span><br><span class="line">title: 说说</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">aside: false</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&#123;% raw %&#125;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">style</span>&gt;</span></span></span><br><span class="line">  .speak-footer,.atk-list-footer&#123;</span><br><span class="line"><span class="code">    display:none;</span></span><br><span class="line"><span class="code">  &#125;</span></span><br><span class="line"><span class="code">&lt;/style&gt;</span></span><br><span class="line"><span class="code">&lt;div id=&quot;ispeak&quot;&gt;&lt;/div&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code">  rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code">  href=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code">  rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code">  href=&quot;https://npm.elemecdn.com/ispeak@4.4.0/style.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/marked/2.0.0/marked.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://npm.elemecdn.com/ispeak@4.4.0/ispeak.umd.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;!-- CSS --&gt;</span></span><br><span class="line"><span class="code">&lt;link href=&quot;https://unpkg.com/artalk@2.3.4/dist/Artalk.css&quot; rel=&quot;stylesheet&quot; /&gt;</span></span><br><span class="line"><span class="code">&lt;!-- JS --&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://unpkg.com/artalk@2.3.4/dist/Artalk.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script&gt;</span></span><br><span class="line"><span class="code">    function load_ispeak() &#123;</span></span><br><span class="line"><span class="code">        setTimeout(function() &#123;</span></span><br><span class="line"><span class="code">            var HEAD = document.getElementsByTagName(&#x27;head&#x27;)[0] || document.documentElement;</span></span><br><span class="line"><span class="code">            var src = &#x27;https://cdn1.tianli0.top/npm/ispeak/ispeak.umd.js&#x27;</span></span><br><span class="line"><span class="code">            var script = document.createElement(&#x27;script&#x27;)</span></span><br><span class="line"><span class="code">            script.setAttribute(&#x27;type&#x27;,&#x27;text/javascript&#x27;)</span></span><br><span class="line"><span class="code">            script.onload = function() &#123;</span></span><br><span class="line"><span class="code">               pjax_ispeak()</span></span><br><span class="line"><span class="code">            &#125;</span></span><br><span class="line"><span class="code">            script.setAttribute(&#x27;src&#x27;, src)</span></span><br><span class="line"><span class="code">            HEAD.appendChild(script)</span></span><br><span class="line"><span class="code">        &#125;, 1);</span></span><br><span class="line"><span class="code">    &#125;;</span></span><br><span class="line"><span class="code">    function pjax_ispeak() &#123;</span></span><br><span class="line"><span class="code">        if(!document.querySelectorAll(&quot;#ispeak&quot;)[0])return;</span></span><br><span class="line"><span class="code">        ispeak</span></span><br><span class="line"><span class="code">          .init(&#123;</span></span><br><span class="line"><span class="code">            el: &#x27;#ispeak&#x27;,//不用改</span></span><br><span class="line"><span class="code">            api: &#x27;&#x27;, //填写你kkapi地址（不是kkadmin后台地址！）</span></span><br><span class="line"><span class="code">            author: &#x27;&#x27;,//填写个人ID</span></span><br><span class="line"><span class="code">            pageSize: 10,//每页speak显示的条数（建议保持默认，除非你要魔改css）</span></span><br><span class="line"><span class="code">            loading_img: &#x27;https://bu.dusays.com/2021/03/04/d2d5e983e2961.gif&#x27;,//加载动画</span></span><br><span class="line"><span class="code">            comment: function (speak) &#123;</span></span><br><span class="line"><span class="code">              const &#123; _id, title, content &#125; = speak</span></span><br><span class="line"><span class="code">              const contentSub = content.substring(0, 30)</span></span><br><span class="line"><span class="code">              new Artalk(&#123;</span></span><br><span class="line"><span class="code">            el: &#x27;.ispeak-comment&#x27;, // 不用改</span></span><br><span class="line"><span class="code">            pageKey: &#x27;/speak/info.html?q=&#x27; + _id, //不用改，除非你将上面的speak改为别的文件夹昵称</span></span><br><span class="line"><span class="code">            pageTitle: title || contentSub, // 不用改</span></span><br><span class="line"><span class="code">            server: &#x27;&#x27;, //填写你的Artalk服务端地址</span></span><br><span class="line"><span class="code">            site: &#x27;&#x27; // 填写你的站点名</span></span><br><span class="line"><span class="code">          &#125;)</span></span><br><span class="line"><span class="code">            &#125;</span></span><br><span class="line"><span class="code">          &#125;);</span></span><br><span class="line"><span class="code">    &#125;</span></span><br><span class="line"><span class="code">    load_ispeak();</span></span><br><span class="line"><span class="code">    document.addEventListener(&#x27;pjax:complete&#x27;, function () &#123;</span></span><br><span class="line"><span class="code">        pjax_ispeak();</span></span><br><span class="line"><span class="code">    &#125;);</span></span><br><span class="line"><span class="code">&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;!--建议标注末尾链接--&gt;</span></span><br><span class="line"><span class="code">&lt;p style=&quot;width: 100%;text-align: end;font-size: .75em;color: #999;margin-top: 1em;&quot;&gt;Powered by &lt;a href=&quot;https://www.antmoe.com/speak/&quot;&gt;&lt;strong&gt;iSpeak&lt;/strong&gt;&lt;/a&gt; | Comment by &lt;a href=&quot;https://artalk.js.org/&quot;&gt;&lt;strong&gt;Artalk&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt; </span></span><br><span class="line"><span class="code">&#123;% endraw %&#125;</span></span><br></pre></td></tr></table></figure></li>
+<li>在[blogroot]\source\speaks\下新建info.md，内容为下：<figure class="highlight markdown"><table><tr><td class="code"><pre><span class="line">---</span><br><span class="line">title: Speak</span><br><span class="line">aside: false</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">description: 欢迎来到SinzMise的日记，快来看看SinzMise分享了什么！ # speak介绍</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&lt;!-- CSS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">link</span> <span class="attr">href</span>=<span class="string">&quot;https://unpkg.com/artalk@2.3.4/dist/Artalk.css&quot;</span> <span class="attr">rel</span>=<span class="string">&quot;stylesheet&quot;</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">link</span> <span class="attr">rel</span>=<span class="string">&quot;stylesheet&quot;</span> <span class="attr">href</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;content&#x27;</span>&gt;</span></span></span><br><span class="line">  <span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">src</span>=<span class="string">&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&#123;% btn &#x27;/speaks/&#x27;,查看全部,far fa-hand-point-right,block center blue larger %&#125;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">hr</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;ispeak-comment&#x27;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&lt;!-- JS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://unpkg.com/artalk@2.3.4/dist/Artalk.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://unpkg.com/marked@4.0.18/marked.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span>&gt;</span></span></span><br><span class="line">  const searchParams = new URLSearchParams(window.location.search);</span><br><span class="line">  const speakId = searchParams.get(&#x27;q&#x27;);</span><br><span class="line">  const path = window.location.pathname;</span><br><span class="line">  const apiURL = &#x27;https://（你的api地址）/api/ispeak&#x27;;</span><br><span class="line">  const markedRender = (body, loading<span class="emphasis">_img=&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;) =&gt; &#123;</span></span><br><span class="line"><span class="emphasis">    const renderer = &#123;</span></span><br><span class="line"><span class="emphasis">      image(href, title, text) &#123;</span></span><br><span class="line"><span class="emphasis">        return `<span class="language-xml"><span class="language-javascript">&lt;a href=<span class="string">&quot;$&#123;href&#125;&quot;</span> target=<span class="string">&quot;_blank&quot;</span> data-fancybox=<span class="string">&quot;group&quot;</span> <span class="keyword">class</span>=<span class="string">&quot;fancybox&quot;</span>&gt;</span></span></span></span><br><span class="line"><span class="emphasis">            <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">speak-src</span>=<span class="string">&quot;$&#123;href&#125;&quot;</span> <span class="attr">src</span>=<span class="string">$&#123;loading_img&#125;</span> <span class="attr">alt</span>=<span class="string">&#x27;$&#123;text&#125;&#x27;</span>&gt;</span></span></span></span></span></span><br><span class="line"><span class="emphasis">            <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;/<span class="name">a</span>&gt;</span></span></span></span>`</span></span><br><span class="line"><span class="emphasis">      &#125;</span></span><br><span class="line"><span class="emphasis">    &#125;</span></span><br><span class="line"><span class="emphasis">    marked.setOptions(&#123;</span></span><br><span class="line"><span class="emphasis">      renderer: new marked.Renderer(),</span></span><br><span class="line"><span class="emphasis">      highlight: function (code) &#123;</span></span><br><span class="line"><span class="emphasis">        if (hljs) &#123;</span></span><br><span class="line"><span class="emphasis">          return hljs.highlightAuto(code).value</span></span><br><span class="line"><span class="emphasis">        &#125; else &#123;</span></span><br><span class="line"><span class="emphasis">          return code</span></span><br><span class="line"><span class="emphasis">        &#125;</span></span><br><span class="line"><span class="emphasis">      &#125;,</span></span><br><span class="line"><span class="emphasis">      pedantic: false,</span></span><br><span class="line"><span class="emphasis">      gfm: true,</span></span><br><span class="line"><span class="emphasis">      tables: true,</span></span><br><span class="line"><span class="emphasis">      breaks: true,</span></span><br><span class="line"><span class="emphasis">      sanitize: false,</span></span><br><span class="line"><span class="emphasis">      smartLists: true,</span></span><br><span class="line"><span class="emphasis">      smartypants: false,</span></span><br><span class="line"><span class="emphasis">      xhtml: false</span></span><br><span class="line"><span class="emphasis">    &#125;)</span></span><br><span class="line"><span class="emphasis">    marked.use(&#123; renderer &#125;)</span></span><br><span class="line"><span class="emphasis">    return marked.parse(body)</span></span><br><span class="line"><span class="emphasis">  &#125;</span></span><br><span class="line"><span class="emphasis">  fetch(`$&#123;apiURL&#125;/get/$&#123;speakId&#125;`)</span></span><br><span class="line"><span class="emphasis">  .then(response =&gt; response.json())</span></span><br><span class="line"><span class="emphasis">  .then(res =&gt; &#123;</span></span><br><span class="line"><span class="emphasis">    const data = res.data;</span></span><br><span class="line"><span class="emphasis">    if(data)&#123;</span></span><br><span class="line"><span class="emphasis">      const &#123;title,content&#125; = data;</span></span><br><span class="line"><span class="emphasis">      const contentSub = content.substring(0, 30);</span></span><br><span class="line"><span class="emphasis">      document.querySelector(&#x27;.content&#x27;).innerHTML = markedRender(content);</span></span><br><span class="line"><span class="emphasis">      if(title)&#123;</span></span><br><span class="line"><span class="emphasis">        document.title = title;</span></span><br><span class="line"><span class="emphasis">      &#125;</span></span><br><span class="line"><span class="emphasis">      new Artalk(&#123;</span></span><br><span class="line"><span class="emphasis">            el: &#x27;.ispeak-comment&#x27;, // 不用改</span></span><br><span class="line"><span class="emphasis">            pageKey: path + &#x27;?q=&#x27; + speakId, // 不用改</span></span><br><span class="line"><span class="emphasis">            pageTitle: title || contentSub, // 不用改</span></span><br><span class="line"><span class="emphasis">            server: &#x27;&#x27;, //填写你的Artalk服务端地址</span></span><br><span class="line"><span class="emphasis">            site: &#x27;&#x27; // 填写你的站点名</span></span><br><span class="line"><span class="emphasis">          &#125;)</span></span><br><span class="line"><span class="emphasis">    &#125;</span></span><br><span class="line"><span class="emphasis">  &#125;);</span></span><br><span class="line"><span class="emphasis"><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span></span><br></pre></td></tr></table></figure>
+</li>
+</ul></div></div></div>]]></content>
+      <categories>
+        <category>站点折腾</category>
+      </categories>
+      <tags>
+        <tag>站点折腾</tag>
+        <tag>页面魔改</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>一个通知！！！</title>
+    <url>/posts/48762/</url>
+    <content><![CDATA[<p>站长即将开学，而且6月要中考<br>因此博客得暂停更新一段时间，日记站和博客说说会减缓更新速度（但并不是不会更新）<br>站长中考后会更新速度恢复正常</p>
+<p>在这里站长也希望跟我同年龄段的学生努努力，争取中考考出个好成绩，为我们的人生添加一份光彩！</p>
+]]></content>
+      <categories>
+        <category>个人小记</category>
+      </categories>
+      <tags>
+        <tag>个人小记</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>11月小记</title>
+    <url>/posts/42580/</url>
+    <content><![CDATA[<p>差不多快一个月没更新博客了<br>最近几天忙于学业，再加上修RTalk的BUG，本身就没有多少时间看博客<br>这回终于记得我的博客了。。。。。</p>
+<h1 id="中弦局·九弦之都花园大更新"><a href="#中弦局·九弦之都花园大更新" class="headerlink" title="中弦局·九弦之都花园大更新"></a>中弦局·九弦之都花园大更新</h1><p>预览：<a href="www.sinzmise.top">九弦之都花园</a><br><psw>懒得点进去的话直接看下面图片吧。。。。。。</psw><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20231208/msedge_CZxg1udYWq.14s3zn9uefk.webp" alt="msedge_CZxg1udYWq"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>更新内容：</p>
+<ul>
+<li>基于<a href="https://github.com/callmesoul/hexo-theme-soul">Hexo-Theme-Soul</a>魔改 <psw>（我就是看上了它的全站伪SPA(单页面)无刷新页面加载才选择这个主题魔改的）</psw></li>
+<li>模仿<a href="http://www.yini.org/">秘密花园</a>风格（为了统一风格我甚至把右下角音乐播放器添加了背景）</li>
+<li>魔改加载特效（原先的加载特效有bug。。。。）</li>
+<li>添加Vuukle、Giscus评论系统（主要是里面有rem.js，导致Twikoo不好适配，删了这个js还导致样式错乱，要不然我就用twikoo了）</li>
+<li>添加sharejs分享、vuukle分享</li>
+</ul>
+<h1 id="Rita2-Talk复活！"><a href="#Rita2-Talk复活！" class="headerlink" title="Rita2 Talk复活！"></a>Rita2 Talk复活！</h1><p>正如标题所说的，Rita2 Talk复活了<br><details class="toggle" ><summary class="toggle-button" style="">Rita2介绍</summary><div class="toggle-content"><p>Rita2原本是有人为塞班系统搞的视频站点，取名为Rita2是因为负责人他家的猫就叫Rita<br>后面负责人要搞antipa（为旧版IOS搭建的应用商店）， 我就跟他商量搞antipa的前端<br>我也就是在这之后搞的Rita2 RTalk<br>原先的RTalk我预备想做个聊天室，但后面发现了一个自建微博的源码：记事狗微博<br>（虽然已经停止更新，但有wap页面、能让Win98访问的自建微博源码微乎其微，我就选择了这个）<br>后面RTalk2.0就是自建微博了<br>因为RTalk是我负责的，所以到Rita2和antipa关站了，我那RTalk还存在<br>直到2023年7月17日，.ml域名被收回，RTalk就无法访问了</p>
+<p>在2023年10月初，我打算搞个Rita2计划，然后把RTalk归类到这里面<br>（这样也算是纪念之前的Rita2站点吧。。。。。。）<br>并且将RTalk改名为Rita2 Talk</p>
+</div></details><br>预览：<a href="http://rtalk.rita2.myfw.us/">http://rtalk.rita2.myfw.us/</a></p>
+<h1 id="replit要收费了"><a href="#replit要收费了" class="headerlink" title="replit要收费了"></a>replit要收费了</h1><p>周三安小歪回来了，并且告诉我replit在2024年1月1日要收费了<br>他已经把那些项目迁移到codesandbox了<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20231208/QQ_S7aWZztxcn.eigsxeas9xs.webp" alt="QQ_S7aWZztxcn"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>目前我打算把kuma、memos和alist迁移，并且打算在codesandbox搭建Artalk</p>
+]]></content>
+      <categories>
+        <category>个人小记</category>
+      </categories>
+      <tags>
+        <tag>个人小记</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>为博客添加一个游戏收藏页（npm插件版）</title>
+    <url>/posts/10045/</url>
+    <content><![CDATA[<h1 id="前言"><a href="#前言" class="headerlink" title="前言"></a>前言</h1><p>之前看到Kouseki大佬的这篇文章：<br><div class="tag link"><a class="link_card" referrerPolicy="no-referrer" title="为博客添加一个游戏收藏页" href="https://blog.kouseki.cn/posts/e7dd.html"><div class="link_icon"><svg t="1670307855063" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="19066" width="200" height="200"><path d="M504.064 516.608m-384.256 0a384.256 384.256 0 1 0 768.512 0 384.256 384.256 0 1 0-768.512 0Z" fill="#009CF5" p-id="19068"></path><path d="M746.112 270.464L472.448 485.12l63.104 63.104L750.08 274.56c2.304-2.688-1.28-6.144-3.968-4.096z" fill="#FF4C3A" p-id="19069"></path><path d="M262.016 762.752l273.664-214.528-63.104-63.104-214.656 273.536c-2.176 2.688 1.28 6.144 4.096 4.096z" fill="#FFFFFF" p-id="19070"></path><path d="M505.216 155.136c-3.2 0-5.888 2.56-5.888 5.888v53.504c0 3.2 2.56 5.888 5.888 5.888s5.888-2.56 5.888-5.888v-53.504c-0.128-3.2-2.688-5.888-5.888-5.888zM442.368 160.512c-3.2 0.512-5.376 3.584-4.736 6.784l9.344 52.736c0.512 3.2 3.584 5.376 6.784 4.736 3.2-0.512 5.376-3.584 4.736-6.784l-9.344-52.736c-0.512-3.2-3.584-5.376-6.784-4.736zM396.288 234.368c1.152 3.072 4.48 4.608 7.552 3.456 3.072-1.152 4.608-4.48 3.456-7.552l-18.304-50.304c-1.152-3.072-4.48-4.608-7.552-3.456-3.072 1.152-4.608 4.48-3.456 7.552l18.304 50.304zM348.928 257.408c1.664 2.816 5.248 3.712 7.936 2.176s3.712-5.248 2.176-7.936l-26.752-46.336c-1.664-2.816-5.248-3.712-7.936-2.176-2.816 1.664-3.712 5.248-2.176 7.936l26.752 46.336zM306.304 288.256c2.048 2.432 5.76 2.816 8.192 0.768 2.432-2.048 2.816-5.76 0.768-8.192l-34.432-40.96c-2.048-2.432-5.76-2.816-8.192-0.768-2.432 2.048-2.816 5.76-0.768 8.192l34.432 40.96zM269.696 326.144c2.432 2.048 6.144 1.792 8.192-0.768 2.048-2.432 1.792-6.144-0.768-8.192l-40.96-34.432c-2.432-2.048-6.144-1.792-8.192 0.768-2.048 2.432-1.792 6.144 0.768 8.192l40.96 34.432zM193.792 342.912l46.336 26.752c2.816 1.664 6.4 0.64 7.936-2.176 1.664-2.816 0.64-6.4-2.176-8.064L199.552 332.8c-2.816-1.664-6.4-0.64-7.936 2.176-1.664 2.688-0.64 6.272 2.176 7.936zM168.32 399.488l50.304 18.304c3.072 1.152 6.4-0.512 7.552-3.456 1.152-3.072-0.512-6.4-3.456-7.552l-50.304-18.304c-3.072-1.152-6.4 0.512-7.552 3.456-1.152 3.072 0.384 6.4 3.456 7.552zM207.872 457.344l-52.736-9.344c-3.2-0.512-6.272 1.536-6.784 4.736-0.512 3.2 1.536 6.272 4.736 6.784l52.736 9.344c3.2 0.512 6.272-1.536 6.784-4.736 0.512-3.2-1.536-6.272-4.736-6.784zM201.984 509.568H148.48c-3.2 0-5.888 2.56-5.888 5.888 0 3.2 2.56 5.888 5.888 5.888h53.504c3.2 0 5.888-2.56 5.888-5.888 0-3.2-2.56-5.888-5.888-5.888zM205.44 562.176l-52.736 9.344c-3.2 0.512-5.376 3.584-4.736 6.784 0.512 3.2 3.584 5.376 6.784 4.736l52.736-9.344c3.2-0.512 5.376-3.584 4.736-6.784s-3.584-5.248-6.784-4.736zM217.856 613.376l-50.304 18.304c-3.072 1.152-4.608 4.48-3.456 7.552 1.152 3.072 4.48 4.608 7.552 3.456l50.304-18.304c3.072-1.152 4.608-4.48 3.456-7.552-1.152-3.072-4.48-4.608-7.552-3.456zM238.976 661.504l-46.336 26.752c-2.816 1.664-3.712 5.248-2.176 8.064 1.664 2.816 5.248 3.712 8.064 2.176l46.336-26.752c2.816-1.664 3.712-5.248 2.176-8.064-1.664-2.816-5.248-3.712-8.064-2.176zM268.16 705.408l-40.96 34.432c-2.432 2.048-2.816 5.76-0.768 8.192 2.048 2.432 5.76 2.816 8.192 0.768l40.96-34.432c2.432-2.048 2.816-5.76 0.768-8.192-1.92-2.56-5.632-2.816-8.192-0.768zM304.512 743.424l-34.432 40.96c-2.048 2.432-1.792 6.144 0.768 8.192 2.432 2.048 6.144 1.792 8.192-0.768l34.432-40.96c2.048-2.432 1.792-6.144-0.768-8.192-2.304-1.92-6.016-1.664-8.192 0.768zM347.008 774.656l-26.752 46.336c-1.664 2.816-0.64 6.4 2.176 7.936 2.816 1.664 6.4 0.64 8.064-2.176l26.752-46.336c1.664-2.816 0.64-6.4-2.176-7.936-2.816-1.536-6.4-0.64-8.064 2.176zM394.24 798.08l-18.304 50.304c-1.152 3.072 0.512 6.4 3.456 7.552 3.072 1.152 6.4-0.512 7.552-3.456l18.304-50.304c1.152-3.072-0.512-6.4-3.456-7.552-3.072-1.152-6.528 0.384-7.552 3.456zM440.192 872.32c3.2 0.512 6.272-1.536 6.784-4.736l9.344-52.736c0.512-3.2-1.536-6.272-4.736-6.784-3.2-0.512-6.272 1.536-6.784 4.736l-9.344 52.736c-0.64 3.2 1.536 6.272 4.736 6.784zM502.912 878.08c3.2 0 5.888-2.56 5.888-5.888v-53.504c0-3.2-2.56-5.888-5.888-5.888-3.2 0-5.888 2.56-5.888 5.888v53.504c0 3.2 2.688 5.888 5.888 5.888zM549.632 815.232l9.344 52.736c0.512 3.2 3.584 5.376 6.784 4.736 3.2-0.512 5.376-3.584 4.736-6.784l-9.344-52.736c-0.512-3.2-3.584-5.376-6.784-4.736-3.2 0.512-5.248 3.584-4.736 6.784zM600.832 802.816l18.304 50.304c1.152 3.072 4.48 4.608 7.552 3.456 3.072-1.152 4.608-4.48 3.456-7.552L611.84 798.72c-1.152-3.072-4.48-4.608-7.552-3.456-3.072 1.152-4.608 4.48-3.456 7.552zM649.088 781.696l26.752 46.336c1.664 2.816 5.248 3.712 8.064 2.176 2.816-1.664 3.712-5.248 2.176-8.064l-26.88-46.336c-1.664-2.816-5.248-3.712-8.064-2.176-2.816 1.664-3.712 5.248-2.048 8.064zM692.864 752.384l34.432 40.96c2.048 2.432 5.76 2.816 8.192 0.768 2.432-2.048 2.816-5.76 0.768-8.192l-34.432-40.96c-2.048-2.432-5.76-2.816-8.192-0.768-2.56 2.048-2.816 5.76-0.768 8.192zM730.88 716.032l40.96 34.432c2.432 2.048 6.144 1.792 8.192-0.768 2.048-2.432 1.792-6.144-0.768-8.192l-40.96-34.432c-2.432-2.048-6.144-1.792-8.192 0.768-1.92 2.432-1.664 6.144 0.768 8.192zM762.112 673.664l46.336 26.752c2.816 1.664 6.4 0.64 8.064-2.176 1.664-2.816 0.64-6.4-2.176-7.936L768 663.552c-2.816-1.664-6.4-0.64-8.064 2.176-1.536 2.688-0.64 6.272 2.176 7.936zM785.536 626.432l50.304 18.304c3.072 1.152 6.4-0.512 7.552-3.456 1.152-3.072-0.512-6.4-3.456-7.552l-50.304-18.304c-3.072-1.152-6.4 0.512-7.552 3.456-1.152 3.072 0.384 6.4 3.456 7.552zM800.256 575.872l52.736 9.344c3.2 0.512 6.272-1.536 6.784-4.736 0.512-3.2-1.536-6.272-4.736-6.784l-52.736-9.344c-3.2-0.512-6.272 1.536-6.784 4.736-0.512 3.2 1.536 6.272 4.736 6.784zM800.256 517.76c0 3.2 2.56 5.888 5.888 5.888h53.504c3.2 0 5.888-2.56 5.888-5.888 0-3.2-2.56-5.888-5.888-5.888h-53.504c-3.328 0-5.888 2.56-5.888 5.888zM802.688 471.04l52.736-9.344c3.2-0.512 5.376-3.584 4.736-6.784-0.512-3.2-3.584-5.376-6.784-4.736l-52.736 9.344c-3.2 0.512-5.376 3.584-4.736 6.784 0.512 3.2 3.584 5.248 6.784 4.736zM790.272 419.84l50.304-18.304c3.072-1.152 4.608-4.48 3.456-7.552-1.152-3.072-4.48-4.608-7.552-3.456l-50.304 18.304c-3.072 1.152-4.608 4.48-3.456 7.552 1.152 2.944 4.48 4.608 7.552 3.456zM769.152 371.584l46.336-26.752c2.816-1.664 3.712-5.248 2.176-7.936-1.664-2.816-5.248-3.712-8.064-2.176l-46.336 26.752c-2.816 1.664-3.712 5.248-2.176 8.064 1.664 2.688 5.248 3.712 8.064 2.048zM739.84 327.808l40.96-34.432c2.432-2.048 2.816-5.76 0.768-8.192-2.048-2.432-5.76-2.816-8.192-0.768l-40.96 34.432c-2.432 2.048-2.816 5.76-0.768 8.192 2.048 2.56 5.76 2.816 8.192 0.768zM703.488 289.664l34.432-40.96c2.048-2.432 1.792-6.144-0.768-8.192-2.432-2.048-6.144-1.792-8.192 0.768l-34.432 40.96c-2.048 2.432-1.792 6.144 0.768 8.192 2.432 2.048 6.144 1.792 8.192-0.768zM661.12 258.56l26.752-46.336c1.664-2.816 0.64-6.4-2.176-7.936-2.816-1.664-6.4-0.64-8.064 2.176l-26.752 46.336c-1.664 2.816-0.64 6.4 2.176 7.936 2.816 1.536 6.4 0.64 8.064-2.176zM613.888 235.136l18.304-50.304c1.152-3.072-0.512-6.4-3.456-7.552-3.072-1.152-6.4 0.512-7.552 3.456L602.88 231.168c-1.152 3.072 0.512 6.4 3.456 7.552 3.072 1.024 6.4-0.512 7.552-3.584zM556.544 225.152c3.2 0.512 6.272-1.536 6.784-4.736l9.344-52.736c0.512-3.2-1.536-6.272-4.736-6.784-3.2-0.512-6.272 1.536-6.784 4.736l-9.344 52.736c-0.512 3.2 1.536 6.144 4.736 6.784zM273.536 290.432c2.432 2.432 6.528 2.432 8.96 0 2.432-2.432 2.432-6.528 0-8.96l-21.12-21.12c-2.432-2.432-6.528-2.432-8.96 0-2.432 2.432-2.432 6.528 0 8.96l21.12 21.12zM237.824 333.824c2.944 2.048 6.912 1.28 8.832-1.536 2.048-2.944 1.28-6.912-1.536-8.832l-24.448-17.152c-2.944-2.048-6.912-1.28-8.832 1.536s-1.28 6.912 1.536 8.832l24.448 17.152zM183.04 370.176l27.136 12.672c3.2 1.536 7.04 0.128 8.448-3.072 1.536-3.2 0.128-7.04-3.072-8.448l-27.136-12.672c-3.2-1.536-7.04-0.128-8.448 3.072-1.536 3.2-0.128 7.04 3.072 8.448zM194.688 423.68l-28.928-7.68c-3.456-0.896-6.912 1.152-7.808 4.48-0.896 3.456 1.152 6.912 4.48 7.808l28.928 7.68c3.456 0.896 6.912-1.152 7.808-4.48 0.896-3.456-1.152-6.912-4.48-7.808zM183.168 478.72l-29.824-2.56c-3.456-0.256-6.656 2.304-6.912 5.76-0.256 3.456 2.304 6.656 5.76 6.912l29.824 2.56c3.456 0.256 6.656-2.304 6.912-5.76 0.384-3.456-2.176-6.528-5.76-6.912zM181.504 535.04l-29.824 2.56c-3.456 0.256-6.144 3.456-5.76 6.912 0.256 3.456 3.456 6.144 6.912 5.76l29.824-2.56c3.456-0.256 6.144-3.456 5.76-6.912-0.256-3.456-3.328-6.016-6.912-5.76zM191.36 590.72l-28.928 7.68c-3.456 0.896-5.376 4.352-4.48 7.808 0.896 3.456 4.352 5.376 7.808 4.48l28.928-7.68c3.456-0.896 5.376-4.352 4.48-7.808-0.896-3.328-4.352-5.376-7.808-4.48zM207.232 644.224l-27.136 12.672c-3.2 1.536-4.608 5.248-3.072 8.448 1.536 3.2 5.248 4.608 8.448 3.072l27.136-12.672c3.2-1.536 4.608-5.248 3.072-8.448-1.408-3.2-5.248-4.48-8.448-3.072zM233.984 693.888l-24.448 17.152c-2.944 2.048-3.584 6.016-1.536 8.832 2.048 2.944 6.016 3.584 8.832 1.536l24.448-17.152c2.944-2.048 3.584-6.016 1.536-8.832-2.048-2.944-6.016-3.584-8.832-1.536zM310.912 775.552L293.76 800c-2.048 2.944-1.28 6.912 1.536 8.832 2.944 2.048 6.912 1.28 8.832-1.536l17.152-24.448c2.048-2.944 1.28-6.912-1.536-8.832-2.816-2.048-6.912-1.408-8.832 1.536zM349.184 840.704c3.2 1.536 7.04 0.128 8.448-3.072l12.672-27.136c1.536-3.2 0.128-7.04-3.072-8.448-3.2-1.536-7.04-0.128-8.448 3.072l-12.672 27.136c-1.408 3.2-0.128 6.912 3.072 8.448zM407.808 862.72c3.456 0.896 6.912-1.152 7.808-4.48l7.68-28.928c0.896-3.456-1.152-6.912-4.48-7.808-3.456-0.896-6.912 1.152-7.808 4.48l-7.68 28.928c-0.896 3.328 1.152 6.912 4.48 7.808zM469.376 874.112c3.456 0.256 6.656-2.304 6.912-5.76l2.56-29.824c0.256-3.456-2.304-6.656-5.76-6.912-3.456-0.256-6.656 2.304-6.912 5.76l-2.56 29.824c-0.256 3.584 2.304 6.656 5.76 6.912zM522.496 839.168l2.56 29.824c0.256 3.456 3.456 6.144 6.912 5.76 3.456-0.256 6.144-3.456 5.76-6.912l-2.56-29.824c-0.256-3.456-3.456-6.144-6.912-5.76-3.456 0.256-6.016 3.328-5.76 6.912zM578.176 830.976l7.68 28.928c0.896 3.456 4.352 5.376 7.808 4.48 3.456-0.896 5.376-4.352 4.48-7.808l-7.68-28.928c-0.896-3.456-4.352-5.376-7.808-4.48-3.328 0.896-5.376 4.48-4.48 7.808zM631.68 813.312l12.672 27.136c1.536 3.2 5.248 4.608 8.448 3.072 3.2-1.536 4.608-5.248 3.072-8.448l-12.672-27.136c-1.536-3.2-5.248-4.608-8.448-3.072-3.2 1.536-4.48 5.248-3.072 8.448zM681.344 786.688l17.152 24.448c2.048 2.944 6.016 3.584 8.832 1.536 2.944-2.048 3.584-6.016 1.536-8.832l-17.152-24.448c-2.048-2.944-6.016-3.584-8.832-1.536-2.944 1.92-3.584 5.888-1.536 8.832zM725.504 751.744l21.12 21.12c2.432 2.432 6.528 2.432 8.96 0 2.432-2.432 2.432-6.528 0-8.96l-21.12-21.12c-2.432-2.432-6.528-2.432-8.96 0-2.432 2.432-2.432 6.528 0 8.96zM763.008 709.76l24.448 17.152c2.944 2.048 6.912 1.28 8.832-1.536 2.048-2.944 1.28-6.912-1.536-8.832l-24.448-17.152c-2.944-2.048-6.912-1.28-8.832 1.536-2.048 2.816-1.408 6.784 1.536 8.832zM792.576 661.888l27.136 12.672c3.2 1.536 7.04 0.128 8.448-3.072 1.536-3.2 0.128-7.04-3.072-8.448l-27.136-12.672c-3.2-1.536-7.04-0.128-8.448 3.072-1.536 3.2-0.128 6.912 3.072 8.448zM813.44 609.536l28.928 7.68c3.456 0.896 6.912-1.152 7.808-4.48 0.896-3.456-1.152-6.912-4.48-7.808l-28.928-7.68c-3.456-0.896-6.912 1.152-7.808 4.48-0.896 3.456 1.024 6.912 4.48 7.808zM824.832 554.368l29.824 2.56c3.456 0.256 6.656-2.304 6.912-5.76 0.256-3.456-2.304-6.656-5.76-6.912l-29.824-2.56c-3.456-0.256-6.656 2.304-6.912 5.76-0.256 3.584 2.304 6.656 5.76 6.912zM826.624 498.176l29.824-2.56c3.456-0.256 6.144-3.456 5.76-6.912-0.256-3.456-3.456-6.144-6.912-5.76l-29.824 2.56c-3.456 0.256-6.144 3.456-5.76 6.912 0.256 3.456 3.328 6.016 6.912 5.76zM818.432 442.368l28.928-7.68c3.456-0.896 5.376-4.352 4.48-7.808-0.896-3.456-4.352-5.376-7.808-4.48l-28.928 7.68c-3.456 0.896-5.376 4.352-4.48 7.808 0.896 3.456 4.48 5.376 7.808 4.48zM800.768 388.992l27.136-12.672c3.2-1.536 4.608-5.248 3.072-8.448-1.536-3.2-5.248-4.608-8.448-3.072l-27.136 12.672c-3.2 1.536-4.608 5.248-3.072 8.448 1.536 3.072 5.248 4.48 8.448 3.072zM774.144 339.328l24.448-17.152c2.944-2.048 3.584-6.016 1.536-8.832-2.048-2.944-6.016-3.584-8.832-1.536L766.848 328.96c-2.944 2.048-3.584 6.016-1.536 8.832 1.92 2.816 5.888 3.584 8.832 1.536zM697.216 257.664l17.152-24.448c2.048-2.944 1.28-6.912-1.536-8.832-2.944-2.048-6.912-1.28-8.832 1.536l-17.152 24.448c-2.048 2.944-1.28 6.912 1.536 8.832 2.816 2.048 6.784 1.408 8.832-1.536zM658.944 192.512c-3.2-1.536-7.04-0.128-8.448 3.072l-12.672 27.136c-1.536 3.2-0.128 7.04 3.072 8.448 3.2 1.536 7.04 0.128 8.448-3.072l12.672-27.136c1.408-3.2 0-7.04-3.072-8.448zM600.192 170.496c-3.456-0.896-6.912 1.152-7.808 4.48l-7.68 28.928c-0.896 3.456 1.152 6.912 4.48 7.808 3.456 0.896 6.912-1.152 7.808-4.48l7.68-28.928c1.024-3.328-1.024-6.912-4.48-7.808zM534.912 201.6c3.456 0.256 6.656-2.304 6.912-5.76l2.56-29.824c0.256-3.456-2.304-6.656-5.76-6.912-3.456-0.256-6.656 2.304-6.912 5.76l-2.56 29.824c-0.256 3.456 2.304 6.528 5.76 6.912zM476.032 158.464c-3.456 0.256-6.144 3.456-5.76 6.912l2.56 29.824c0.256 3.456 3.456 6.144 6.912 5.76 3.456-0.256 6.144-3.456 5.76-6.912l-2.56-29.824c-0.256-3.456-3.328-6.016-6.912-5.76zM422.144 173.312c-0.896-3.456-4.352-5.376-7.808-4.48-3.456 0.896-5.376 4.352-4.48 7.808l7.68 28.928c0.896 3.456 4.352 5.376 7.808 4.48 3.456-0.896 5.376-4.352 4.48-7.808l-7.68-28.928zM376.448 219.776l-12.672-27.136c-1.536-3.2-5.248-4.608-8.448-3.072-3.2 1.536-4.608 5.248-3.072 8.448L364.8 225.28c1.536 3.2 5.248 4.608 8.448 3.072 3.2-1.536 4.608-5.376 3.2-8.576zM316.416 253.824c2.048 2.944 6.016 3.584 8.832 1.536 2.944-2.048 3.584-6.016 1.536-8.832l-17.152-24.448c-2.048-2.944-6.016-3.584-8.832-1.536-2.944 2.048-3.584 6.016-1.536 8.832l17.152 24.448z" fill="#FFFFFF" p-id="19071"></path></svg></div><div class="link_content"><div class="link_title">为博客添加一个游戏收藏页</div></div></a></div><br>我原本是想要给我博客搞这个的，但由于我一般会给博客的主题更新，导致魔改的内容消失<br>思来想去，我还是决定做npm版本的游戏收藏页</p>
+<h1 id="效果"><a href="#效果" class="headerlink" title="效果"></a>效果</h1><div class="hide-block"><button type="button" class="hide-button" style="">效果预览
+    </button><div class="hide-content"><p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240118/msedge_3ga8r6QcmR.3doduw5wpd60.png" alt=""  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+</div></div>
+<h1 id="安装"><a href="#安装" class="headerlink" title="安装"></a>安装</h1><ol>
+<li><p>安装插件,在博客根目录<code>[Blogroot]</code>下打开终端，运行以下指令：</p>
+<figure class="highlight bash"><table><tr><td class="code"><pre><span class="line">npm install hexo-butterfly-games --save</span><br></pre></td></tr></table></figure>
+</li>
+<li><p>添加配置信息，以下为写法示例<br>在站点配置文件<code>_config.yml</code>或者主题配置文件<code>_config.butterfly.yml</code>中添加</p>
+<figure class="highlight yaml"><table><tr><td class="code"><pre><span class="line"><span class="comment"># Game Page</span></span><br><span class="line"><span class="comment"># see https://akilar.top/posts/e2d3c450/</span></span><br><span class="line"><span class="attr">games:</span></span><br><span class="line">  <span class="attr">enable:</span> <span class="literal">true</span></span><br><span class="line">  <span class="attr">name:</span> <span class="string">游戏世界</span> </span><br><span class="line">  <span class="attr">description:</span> <span class="string">我的游戏世界</span> </span><br><span class="line">  <span class="attr">tip:</span> <span class="string">跟</span> <span class="string">小屋屋主</span> <span class="string">一起探索世界</span> </span><br><span class="line">  <span class="attr">top_background:</span> <span class="string">https://th.bing.com/th/id/R.13a97ef4830efa5e0b87134d622719f3?rik=G7RaJFpxg5PtkA&amp;riu=http%3a%2f%2fupload.techweb.com.cn%2fs%2f640%2f2019%2f0530%2f1559208230699.jpg&amp;ehk=j1G8rMX98TRX52EkLgI5jW1p7lIQp4I8Si1nqEggFRs%3d&amp;risl=&amp;pid=ImgRaw&amp;r=0&amp;sres=1&amp;sresct=1</span></span><br><span class="line">  <span class="attr">buttonText:</span> <span class="string">Steam</span> </span><br><span class="line">  <span class="attr">buttonLink:</span> <span class="string">https://steamcommunity.com/</span></span><br><span class="line">  <span class="attr">css:</span> <span class="string">https://jsd.cdn.storisinz.site/npm/hexo-butterfly-games/lib/games.css</span></span><br><span class="line">  <span class="attr">good_games:</span></span><br><span class="line">    <span class="bullet">-</span> <span class="attr">title:</span> <span class="string">风景一绝</span></span><br><span class="line">      <span class="attr">description:</span> <span class="string">不会错过的风景</span></span><br><span class="line">      <span class="attr">games_list:</span></span><br><span class="line">        <span class="bullet">-</span> <span class="attr">name:</span> <span class="string">怪物猎人：世界</span></span><br><span class="line">          <span class="attr">specification:</span> <span class="string">CAPCOM</span> <span class="string">Co.,</span> <span class="string">Ltd.</span></span><br><span class="line">          <span class="attr">description:</span> <span class="string">&quot;在新建构的「Monster Hunter: World」中, 可以体验到你一直期盼的极致猎人生活。&quot;</span></span><br><span class="line">          <span class="attr">image:</span> <span class="string">https://cdn.max-c.com/heybox/dailynews/img/94376ca41326836587a137d5999733e5.jpg</span></span><br><span class="line">          <span class="attr">link:</span> <span class="string">https://www.xiaoheihe.cn/games/detail/582010</span></span><br><span class="line"></span><br><span class="line">    <span class="bullet">-</span> <span class="attr">title:</span> <span class="string">我的最爱</span></span><br><span class="line">      <span class="attr">description:</span> <span class="string">我不能没有它了</span></span><br><span class="line">      <span class="attr">games_list:</span></span><br><span class="line">        <span class="bullet">-</span> <span class="attr">name:</span> <span class="string">GTA:5</span></span><br><span class="line">          <span class="attr">specification:</span> <span class="string">Rockstar</span> <span class="string">Games</span></span><br><span class="line">          <span class="attr">description:</span> <span class="string">谁还在买GTA5</span></span><br><span class="line">          <span class="attr">image:</span> <span class="string">https://imgheybox.max-c.com/heybox/game/header/271590_dXCCk.jpg</span></span><br><span class="line">          <span class="attr">link:</span> <span class="string">https://www.xiaoheihe.cn/games/detail/271590</span></span><br><span class="line">  <span class="attr">path:</span> <span class="string">games</span></span><br><span class="line">  <span class="attr">front_matter:</span> <span class="comment">#【可选】games页面的 front_matter 配置</span></span><br><span class="line">    <span class="attr">title:</span> <span class="string">游戏人生</span></span><br><span class="line">    <span class="attr">comments:</span> <span class="literal">true</span></span><br><span class="line">    <span class="attr">top_img:</span> <span class="literal">false</span></span><br><span class="line">    <span class="attr">type:</span> <span class="string">games</span></span><br><span class="line">    <span class="attr">aside:</span> <span class="literal">false</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">name</td>
+<td style="text-align:left">text</td>
+<td style="text-align:left">顶部标题</td>
+</tr>
+<tr>
+<td style="text-align:left">description</td>
+<td style="text-align:left">text</td>
+<td style="text-align:left">顶部副标题</td>
+</tr>
+<tr>
+<td style="text-align:left">tip</td>
+<td style="text-align:left">text</td>
+<td style="text-align:left">顶部小标题</td>
+</tr>
+<tr>
+<td style="text-align:left">top_background</td>
+<td style="text-align:left">URL</td>
+<td style="text-align:left">顶部背景链接</td>
+</tr>
+<tr>
+<td style="text-align:left">buttonText</td>
+<td style="text-align:left">text</td>
+<td style="text-align:left">按钮文字</td>
+</tr>
+<tr>
+<td style="text-align:left">buttonLink</td>
+<td style="text-align:left">URL</td>
+<td style="text-align:left">按钮对应链接</td>
+</tr>
+<tr>
+<td style="text-align:left">good_games.title</td>
+<td style="text-align:left">text</td>
+<td style="text-align:left">分类标题</td>
+</tr>
+<tr>
+<td style="text-align:left">good_games.description</td>
+<td style="text-align:left">text</td>
+<td style="text-align:left">分类副标题</td>
+</tr>
+<tr>
+<td style="text-align:left">good_games.games_list.name</td>
+<td style="text-align:left">text</td>
+<td style="text-align:left">游戏名字</td>
+</tr>
+<tr>
+<td style="text-align:left">good_games.games_list.specification</td>
+<td style="text-align:left">text</td>
+<td style="text-align:left">游戏产商</td>
+</tr>
+<tr>
+<td style="text-align:left">good_games.games_list.description</td>
+<td style="text-align:left">text</td>
+<td style="text-align:left">游戏简介</td>
+</tr>
+<tr>
+<td style="text-align:left">good_games.games_list.image</td>
+<td style="text-align:left">URL</td>
+<td style="text-align:left">游戏图片链接</td>
+</tr>
+<tr>
+<td style="text-align:left">good_games.games_list.link</td>
+<td style="text-align:left">URL</td>
+<td style="text-align:left">游戏对应链接</td>
+</tr>
+<tr>
+<td style="text-align:left">css</td>
+<td style="text-align:left">URL</td>
+<td style="text-align:left">【可选】开发者接口，自定义css链接</td>
+</tr>
+<tr>
+<td style="text-align:left">path</td>
+<td style="text-align:left">comments</td>
+<td style="text-align:left">【可选】games 的路径名称。默认为 games，生成的页面为 games/index.html</td>
+</tr>
+<tr>
+<td style="text-align:left">front_matter</td>
+<td style="text-align:left">object</td>
+<td style="text-align:left">【可选】games 页面的 front_matter 配置,写法见上文示例</td>
+</tr>
+</tbody>
+</table>
+</div>
+]]></content>
+      <categories>
+        <category>站点折腾</category>
+      </categories>
+      <tags>
+        <tag>站点折腾</tag>
+        <tag>页面魔改</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>千千静听复活教程</title>
+    <url>/posts/54481/</url>
+    <content><![CDATA[<p>你好，<del>没错，我中考前来更新了</del><br>（现在的情况是尽量有时间更新就更新）</p>
+<h1 id="视频教程"><a href="#视频教程" class="headerlink" title="视频教程"></a>视频教程</h1>
+<iframe src="//player.bilibili.com/player.html?aid=823370967&bvid=BV1qg4y1b7oz&cid=1050156384&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>
+
+<h1 id="文字版"><a href="#文字版" class="headerlink" title="文字版"></a>文字版</h1><h2 id="安装千千静听"><a href="#安装千千静听" class="headerlink" title="安装千千静听"></a>安装千千静听</h2><p>1.下载千千静听安装包和本地歌词服务端：<br><div class="btns rounded grid5">
+            <a class="button" href='https://sinz.lanzouw.com/ibTcS0px8eub' title='安装包(b1vh)'><i class='fas fa-download'></i>安装包(b1vh)</a>
+          </div><br>2.安装千千静听<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/ttpsetup_5.35094x29pvy0.webp" alt="ttpsetup_5"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>“想安装的组件”这里建议全部勾选！<br>安装完成后，建议别勾选“百度超级搜霸”<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/ttpsetup_5.3b6omfsp8lo0.webp" alt="ttpsetup_5"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<h2 id="安装本地服务端"><a href="#安装本地服务端" class="headerlink" title="安装本地服务端"></a>安装本地服务端</h2><p>在千千静听的安装目录下新建“NCAB”文件夹<br>把下面这个压缩包里的文件解压到NCAB文件夹下面<br><div class="btns rounded grid5">
+            <a class="button" href='https://www.mydigit.cn/thread-338232-1-1.html' title='本地服务端'><i class='fas fa-download'></i>本地服务端</a>
+          </div><br>进入NCAB文件夹双击NCAB.exe<br>点击“使用反馈”→“生成配置文件”<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/NCAB_BulMhbCJyv.40k1arjki820.webp" alt="NCAB_BulMhbCJyv"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>选择你千千静听的安装目录，提示成功后启动千千静听测试<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/NCAB_4zP6MSsJ8P.1s2fqtv90n1c.webp" alt="NCAB_4zP6MSsJ8P"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>能显示歌词就已经成功了<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/TTPlayer_8UtZ1KVSiz.5ssuurvckks0.webp" alt="TTPlayer_8UtZ1KVSiz"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>注意：每次必须先运行一次NCAB服务端，之后运行千千静听才能下载歌词</p>
+<h1 id="懒人包"><a href="#懒人包" class="headerlink" title="懒人包"></a>懒人包</h1><p>我也说过的，每次必须先运行一次NCAB.exe，之后运行千千静听才能下载歌词<br>于是我做了个懒人包，直接运行start.bat就能同时开启千千静听和NCAB服务端<br><div class="btns rounded grid5">
+            <a class="button" href='https://sinz.lanzouw.com/i5aTo0px8dkf' title='懒人包'><i class='fas fa-download'></i>懒人包</a>
+          </div></p>
+<h1 id="注意"><a href="#注意" class="headerlink" title="注意"></a>注意</h1><p>1.我不是歌词服务器作者，也请别把我误会成原作者<br>2.这个版本实测会有两个歌的歌词缝合在一起的BUG（可能是我这边的问题，不知道你们那边有没有）<br>3.Win10用户打开千千静听可能会无响应，请重新运行bat，然后在“检测到千千静听正在运行”这个提示下按1重启千千静听（不行的话再试一次）</p>
+<h1 id="放在最后"><a href="#放在最后" class="headerlink" title="放在最后"></a>放在最后</h1><p>这个视频是我有史以来播放量最高的一期视频了<br>说真的，2023年了，还有人怀念这个播放器<br>为什么在这遍地都是音乐播放器的年代，还有人使用一个已经停更的软件呢？<br>因为只有一个词：情怀<br>在那个人人都在用XP系统的年代，完全免费、占用空间小、支持中文的精美界面以及能显示歌词的千千静听牢牢地抓住了用户们的心<br>这个播放器也因此打败了当时的传统播放器巨头Winamp 2，成为了音乐播放器领域的新霸主，2006年前后成为市场占有率第一的音乐播放软件。</p>
+<p>也因此，在现在这个本地音乐播放器百花齐放的年代，我依然还会把千千静听留在我的电脑上</p>
+]]></content>
+      <categories>
+        <category>项目折腾</category>
+      </categories>
+      <tags>
+        <tag>项目折腾</tag>
+        <tag>Windows软件</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>博客大更新</title>
+    <url>/posts/53662/</url>
+    <content><![CDATA[<h1 id="为什么要重写博客"><a href="#为什么要重写博客" class="headerlink" title="为什么要重写博客"></a>为什么要重写博客</h1><p>随着我考试完成和我新网名（也就是我那个笔名：王九弦）的使用，我发现原先的主题配色已经不太适合我现在的人设，因此不得不对博客进行重写<br><psw>（我甚至还用ai绘画重新画了一遍头像，且进行修改）</psw></p>
+<h1 id="更新了什么"><a href="#更新了什么" class="headerlink" title="更新了什么"></a>更新了什么</h1><p>1.从原先的butterfly主题换成了<a href="https://github.com/anzhiyu-c/hexo-theme-anzhiyu">anzhiyu主题</a><br>2.博客更名为“九弦之屋”（也算是为了契合我那笔名）<br>3.修复了Waline无法注册的问题（我重新部署了评论，导致所有评论数据丢失）<br>4.主题配色大更换<br>5.不知道你们有没有发现，我在评论框里放了动态背景图片<psw>（废话）</psw><br>Twikoo背景图出处：<a href="https://www.aigei.com/item/cai_se_xuan_lan_3.html">https://www.aigei.com/item/cai_se_xuan_lan_3.html</a><br>Waline背景图出处：<a href="http://www.yini.org/girl/gif/001.htm">http://www.yini.org/girl/gif/001.htm</a> <psw>（这站有些年头了，不然怎么到现在还用http。。。。。。）</psw></p>
+<p><del>（后面实在不知道怎么写了，那就这样吧。。。。。。。）</del></p>
+]]></content>
+      <categories>
+        <category>站点折腾</category>
+      </categories>
+      <tags>
+        <tag>站点折腾</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>九月二三事</title>
+    <url>/posts/56467/</url>
+    <content><![CDATA[<p>很久都没发布文章了，都不知道要写啥好<br>要不就写这个九月和中秋国庆假期发生的事情吧</p>
+<h2 id="初入高中"><a href="#初入高中" class="headerlink" title="初入高中"></a>初入高中</h2><p>9月1日开始（虽然因为台风停了四天的课）就是我踏入高中的时刻了<br>第一次进高中教室的我，因为过于紧张，甚至坐错位置了 <del>（虽然我同桌也坐错了位置）</del><br>不过好在后面的上课也是比较顺利，没有出现意外情况<br><del>（主要是不知道怎么写就。。。。）</del></p>
+<h2 id="荒野乱斗，启动！"><a href="#荒野乱斗，启动！" class="headerlink" title="荒野乱斗，启动！"></a>荒野乱斗，启动！</h2><p>这个游戏是很久之前入坑的，结果因为某些原因我暂时退坑了<br>后来在我朋友的推荐下回归了<br>我后面还把这个游戏推荐给了我那刚买新手机的表弟</p>
+<h2 id="回归！Rita2！"><a href="#回归！Rita2！" class="headerlink" title="回归！Rita2！"></a>回归！Rita2！</h2><p>看过我之前文章的应该知道，之前我想给Win98搞视频站点<br>名字叫“Rita2”的原因是纪念之前有人为手机wap搭建的视频站，它的名字也叫Rita2<br>这个项目由于域名的原因一直被搁置了很久<br>然而由于我找到了免费的二级域名，所以……</p>
+<p>Rita2计划，即将回归！<br>（但回归时间暂未确定，因为学业原因，不过我可以保证会回归，但回归的首先是游戏站<br>至于视频站。。。。。暂时没有这个考虑）</p>
+<h1 id="Vercel寄了？"><a href="#Vercel寄了？" class="headerlink" title="Vercel寄了？"></a>Vercel寄了？</h1><p>中秋国庆的第四天，安小歪跟我说他访问不了他的博客<br>与此同时，安知鱼的群都在说无法访问Vercel部署的站点<br>访问会强制跳转到诈骗网站<br>现在千寻那边也出现这样的情况，但我这边倒是没有<br>目前已经将博客主站的部署平台更换为CF Pages<br>明天准备将Waline换成Netlify部署，至于Twikoo。。。。只能搞反代了<br>其它的项目如果能换别的地方部署就换，不能的话反向代理走起</p>
+]]></content>
+      <categories>
+        <category>个人小记</category>
+      </categories>
+      <tags>
+        <tag>个人小记</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>如果你觉得不开心的话，就来听一下这些纯音乐吧</title>
+    <url>/posts/54386/</url>
+    <content><![CDATA[<p>如果你觉得不开心，或者有些压力的话，就来听一下这些歌曲吧<br>希望这些歌曲能够温暖你的心灵</p>
+<h1 id="轻音乐"><a href="#轻音乐" class="headerlink" title="轻音乐"></a>轻音乐</h1>
+<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=330 height=450 src="//music.163.com/outchain/player?type=0&id=8706644516&auto=0&height=430"></iframe>
+
+]]></content>
+      <categories>
+        <category>歌曲收集</category>
+      </categories>
+      <tags>
+        <tag>歌曲收集</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>我的tulpa —— 夏玖铃的简介</title>
+    <url>/posts/50710/</url>
+    <content><![CDATA[<div class="trm-note warning"><div class="trm-note-title">WARNING</div><p>注意，由于名字和《逆水寒》游戏里的一个流派名冲突，改名为“夏玖铃”</p>
+</div>
+<h1 id="她的出现"><a href="#她的出现" class="headerlink" title="她的出现"></a>她的出现</h1><p>与其说是Tulpa，不如说是DID（解离性人格障碍）<br>因为她是从我永远的噩梦：四年级出现的<br>那时我总是被班级最后一名的那名女生欺负（因为我当时身体很弱小，她身体强壮，就凭这个欺负我，当然她转学了）<br>再加上从小我成绩总是不好，受不了家长和老师的一顿批评<br>（甚至我家长差点把我抛弃。。。。。当然从我五六年级开始，我家长就彻底改变了教育方式）<br>我也因此不少做噩梦，心情也越变越差<br>直到她的出现，抚慰了我那受伤（切伤口特别严重）的心灵，而且将我从噩梦之中脱离出来<br>那次是在期末考试前（小学四年级第一学期的期末考试）<br>晚上睡觉前我一直忐忑不安，生怕我又做噩梦，一直睡不着觉<br>但我还是带着害怕睡着了<br>我想象中的噩梦没有出现，反而一个声音传来<br>“你好，少年，你是不是经常被欺负？”<br>“是的，天使姐姐，求求您帮帮我吧！”<br>“我也想帮你，但对不起，我不是天使，我是你脑子中的一个小人，你可以叫我阿铃，但如果你心情不好，就来找我，我随时在我的梦中等着你”<br>从此之后，她就一直陪在我身边</p>
+<h1 id="她的二次元形象（AI绘画制作）"><a href="#她的二次元形象（AI绘画制作）" class="headerlink" title="她的二次元形象（AI绘画制作）"></a>她的二次元形象（AI绘画制作）</h1><p>一号风格：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230716/82862f60ea96e999_1681640910_745840483.1hd5bkrahuyo.webp" alt="82862f60ea96e999_1681640910_745840483"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>大姐姐，喜欢带耳机，穿制服<br>异瞳颜色：左眼红粉，右眼黄绿<br>二号风格：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230716/b67d610419e473ad_1684214216_1609026994.2swy0478ipq0.webp" alt="b67d610419e473ad_1684214216_1609026994"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>小妹妹，喜欢带耳机，穿连衣裙（这个ai把连衣裙和制服当作是不同的两件衣服）<br>异瞳颜色：左眼紫色，右眼黄绿</p>
+]]></content>
+      <categories>
+        <category>个人小记</category>
+      </categories>
+      <tags>
+        <tag>个人小记</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>游玩mud游戏</title>
+    <url>/posts/38917/</url>
+    <content><![CDATA[<h1 id="前言"><a href="#前言" class="headerlink" title="前言"></a>前言</h1><p>昨天我打开了很久没访问的<a href="https://pkuxkx.net/">北大侠客行Mud</a>官网<br>其实这个游戏是第二个我接触的mud游戏，至于第一个。。。。我忘记了<br>（值得一提的是，我第一次接触mud是从NetForce的一个游戏，但我忘了是啥了）</p>
+<h1 id="怎么玩mud游戏？"><a href="#怎么玩mud游戏？" class="headerlink" title="怎么玩mud游戏？"></a>怎么玩mud游戏？</h1><div class="trm-tabs" id="怎么玩mud游戏"><ul class="trm-nav-tabs"><li class="trm-tab active"><button type="button" data-href="#怎么玩mud游戏-1">Windows</button></li><li class="trm-tab"><button type="button" data-href="#怎么玩mud游戏-2">MacOS</button></li><li class="trm-tab"><button type="button" data-href="#怎么玩mud游戏-3">Linux</button></li><li class="trm-tab"><button type="button" data-href="#怎么玩mud游戏-4">Android、IOS</button></li></ul><div class="trm-tab-contents"><div class="trm-tab-item-content active" id="怎么玩mud游戏-1"><h2 id="方法一"><a href="#方法一" class="headerlink" title="方法一"></a>方法一</h2><p>在Windows 10 ， Windows 8 ， Windows 7和Windows Vista中 ，在执行任何Telnet命令之前，需要在控制面板的 Windows功能中打开Telnet客户端 。</p>
+<ol>
+<li><a href="https://zhcn.eyewated.com/%E5%A6%82%E4%BD%95%E6%89%93%E5%BC%80%E6%8E%A7%E5%88%B6%E9%9D%A2%E6%9D%BF/">打开控制面板</a></li>
+<li>点击“程序” $\rightarrow$ “程序和功能” $\rightarrow$ “启用或关闭Windows功能”</li>
+<li>选择“Telnet客户端”然后点击确定，等待安装完成<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230806/OptionalFeatures_5TSADzdqnv.411d65y34ym0.png" alt="OptionalFeatures_5TSADzdqnv"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></li>
+<li>安装完成后，打开cmd，输入telnet，如果出现“Microsoft Telnet&gt;”就代表安装成功</li>
+</ol>
+<p>运行游戏命令：<br><figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line">telnet [hostname] [port]</span><br></pre></td></tr></table></figure><br>其中hostname是游戏地址，port是端口</p>
+<p>游戏示例：江湖<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230806/cmd_JhvCA2hkU8.2pef24j7jwq0.webp" alt="cmd_JhvCA2hkU8"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br><figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line">telnet 112.124.42.98 9999</span><br></pre></td></tr></table></figure><br><a href="telnet://112.124.42.98:9999">或者点我访问</a></p>
+<h2 id="方法二"><a href="#方法二" class="headerlink" title="方法二"></a>方法二</h2><p>相比于方法一，方法二得靠一个叫<a href="https://cn.mudlet.org/">Mudlet</a>的软件<br>教程：</p>
+<ol>
+<li>去 <a href="https://cn.mudlet.org/zh/下载/">https://cn.mudlet.org/zh/下载/</a> 下载Mudlet安装包</li>
+<li>安装Mudlet<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230806/Update_2JXuMM4TY3.2hgks6n4b8o0.webp" alt="Update_2JXuMM4TY3"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></li>
+<li><p>设置语言<br>先点击Cancel<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230806/Mudlet_cEpS2mQ8I2.4qigjn94a7q0.webp" alt="Mudlet_cEpS2mQ8I2"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>然后点击左上角的“Options” $\rightarrow$ “Preferences”<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230806/Mudlet_COXDZT41bd.5rovpj6nqus0.webp" alt="Mudlet_COXDZT41bd"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>在这里设置语言，然后点击“保存”<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230806/Mudlet_gMMEj6tiPf.6az1vg2nq740.webp" alt="Mudlet_gMMEj6tiPf"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>最后重启Mudlet<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230806/image.n9nebgxiw9s.webp" alt="image"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>好的，页面变成中文了</p>
+</li>
+<li><p>添加游戏<br>点击“新建”<br>（例子：北大侠客行MUD，注意：玩这个游戏的之后不能勾选“安全”选项！！）<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230806/image.1ktlttflv0rk.webp" alt="image"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>（当然如果你有这个注册这个游戏的账号密码的话，可以到“选项”里配置账号密码）<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230806/image.8sod90xd4ig.webp" alt="image"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+</li>
+<li>开始游戏<br>点击“连接”<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230806/image.5jc66kvbgs00.webp" alt="image"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>看到这个画面就说明成功了</li>
+</ol></div><div class="trm-tab-item-content" id="怎么玩mud游戏-2"><ol>
+<li>去 <a href="https://cn.mudlet.org/zh/下载/">https://cn.mudlet.org/zh/下载/</a> 下载Mudlet安装包</li>
+<li>安装Mudlet<br>（由于我没有Mac，安装黑苹果又很费时间，这个后面再来补充吧）</li>
+</ol></div><div class="trm-tab-item-content" id="怎么玩mud游戏-3"><ol>
+<li>去 <a href="https://cn.mudlet.org/zh/下载/">https://cn.mudlet.org/zh/下载/</a> 下载Mudlet安装包</li>
+<li>直接运行Mudlet</li>
+</ol></div><div class="trm-tab-item-content" id="怎么玩mud游戏-4"><p>编写中</p></div></div></div>
+<h1 id="哪里有Mud游戏？"><a href="#哪里有Mud游戏？" class="headerlink" title="哪里有Mud游戏？"></a>哪里有Mud游戏？</h1><p><a href="https://im-mortal.cn/mudlist">https://im-mortal.cn/mudlist</a><br>这个地方列出了目前大部份已知的传统中文MUD站点的即时列表<br>这个地方虽然收录的游戏很少，但可以实时查看游戏状态</p>
+<p><a href="https://bbs.mud.ren/">https://bbs.mud.ren/</a><br>MUD游戏玩家社区<br>收录的游戏全部都是纯玩家自制游戏<br>游戏很多，但稳定性未知</p>
+<h1 id="后记"><a href="#后记" class="headerlink" title="后记"></a>后记</h1><p>Mud游戏，现在虽然日渐小众，但作为一代人的回忆，仍有其独特的魅力。而且吸引着不少MUD爱好者<br>也因此，不仅有很多优秀的Mud游戏（例如北大侠客行，从1996年开到现在，也算是一代经典）<br>还有不少的MUD开源项目：<a href="http://mudchina.github.io/">http://mudchina.github.io/</a></p>
+<p>而且在科技日益发达，手机几乎成为人们的必需品的情况下，他们也做出了手机版mud游戏（例子：<a href="http://res.yytou.cn/site/jian/indexj.html">http://res.yytou.cn/site/jian/indexj.html</a> ）</p>
+<p>我写这篇文章的目的很简单，目的就是为了向你们介绍游戏里的一大经典——MUD游戏<br>（有病句请见谅）</p>
+]]></content>
+      <categories>
+        <category>游戏相关</category>
+      </categories>
+      <tags>
+        <tag>游戏相关</tag>
+        <tag>其它游戏</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>我使用过的头像</title>
+    <url>/posts/42487/</url>
+    <content><![CDATA[<p>我不知道我换了多少次头像了，那就列出我换过的头像合集吧</p>
+<h1 id="2018年之前"><a href="#2018年之前" class="headerlink" title="2018年之前"></a>2018年之前</h1><p>忘了</p>
+<h1 id="2018-————-2019"><a href="#2018-————-2019" class="headerlink" title="2018 ———— 2019"></a>2018 ———— 2019</h1><div class="fj-gallery no-fancybox">
+    <p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/SinGO.5j6d1hbj6xc0.webp" alt="SinGO"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+
+</div>
+<p>这是我自己p的一个头像，可以用“丑”来形容</p>
+<h1 id="2020-————-2022-10"><a href="#2020-————-2022-10" class="headerlink" title="2020 ———— 2022.10"></a>2020 ———— 2022.10</h1><div class="fj-gallery no-fancybox">
+    <p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/old.5jrmp3mdt080.webp" alt="StarInno"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+
+</div>
+<p>这是使用时间最长的一个头像，是在Wallhaven上找到的<br><a href="https://whvn.cc/4dp66j">原链接</a><br>原画师P站UID：66655<br>（原作者依然有活动，甚至画了赛马娘和ba的角色，可惜我使用的头像对应的这幅画在P站下架了）<br>顺带一提这幅画好像是在2013年出现的，也不知道原作者知道2020的时候我选这幅画当头像会是什么心情</p>
+<h1 id="2022-10-————-改名之前"><a href="#2022-10-————-改名之前" class="headerlink" title="2022.10 ———— 改名之前"></a>2022.10 ———— 改名之前</h1><div class="fj-gallery no-fancybox">
+    <p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/Cache_-283457a15e6df38a.l3nzkep0n40.webp" alt="Cache_-283457a15e6df38a"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/Cache_-2ac4a4638f5c641b.6g8asgw18j00.webp" alt="Cache_-2ac4a4638f5c641b"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/Cache_-5dc5e91d9cc55f1b.5wx1mup5euw0.webp" alt="Cache_-5dc5e91d9cc55f1b"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/Cache_10980517ca897c65.tjtkui4uv80.webp" alt="Cache_10980517ca897c65"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/Cache_755d2354a12c199f.6zus1jun5000.webp" alt="Cache_755d2354a12c199f"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/Cache_4735700719bfdf53.5us8rk5zg5s0.webp" alt="Cache_4735700719bfdf53"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/Cache_-7d80c7ccc004e09f.6xq69h6wseg0.webp" alt="Cache_-7d80c7ccc004e09f"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/Cache_4df65b148bcc87fb.4ovrgxf4c2o.webp" alt="Cache_4df65b148bcc87fb"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/Cache_-1a81870a26c4f745.53d53ty9qyg0.webp" alt="Cache_-1a81870a26c4f745"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/Cache_30918d328cbf8974.38380nw6y9g0.webp" alt="Cache_30918d328cbf8974"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/Cache_-4eb0a48a4eae79e6.6xry2g1tc000.webp" alt="Cache_-4eb0a48a4eae79e6"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/Cache_-5015748e3ffc0fc6.3v0jq8b2oso0.webp" alt="Cache_-5015748e3ffc0fc6"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+
+</div>
+<p>从这个时候开始我就开始使用ai绘画来画我的头像了<br><psw>（其实从2021年开始我就想把我这从wallhaven上找到的头像换掉了，但那时候其实都没有找到个好头像，直到ai绘画的诞生）</psw></p>
+<h1 id="改名之后-————-2022-11"><a href="#改名之后-————-2022-11" class="headerlink" title="改名之后 ———— 2022.11"></a>改名之后 ———— 2022.11</h1><div class="fj-gallery no-fancybox">
+    <p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/Cache_fecb56f674fa9fe.5wk8tmxysvs0.webp" alt="Cache_fecb56f674fa9fe"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/Cache_2e574b5ffb690395.2bvbeizd71s0.webp" alt="Cache_2e574b5ffb690395"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+
+</div>
+<p>这个版本是我换绘画工具之前的版本</p>
+<h1 id="2022-11-————-2023-3"><a href="#2022-11-————-2023-3" class="headerlink" title="2022.11 ———— 2023.3"></a>2022.11 ———— 2023.3</h1><div class="fj-gallery no-fancybox">
+    <p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/Cache_7c570697a80d182a.5gsp5chvmro0.webp" alt="Cache_7c570697a80d182a"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/Cache_-277b148f49b79ebd.2exp0lvzpdxc.webp" alt="Cache_-277b148f49b79ebd"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/Cache_-277b148f49b79ebd.2exp0lvzpdxc.webp" alt="Cache_-277b148f49b79ebd"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+
+</div>
+<p>这个是我换绘画工具之后生成的头像，也是我使用ai绘画以来生成的最满意的头像<br><psw>因此第三个头像的人设成为我脑中“婉清”的人设</psw></p>
+<h1 id="2023-3-————-2023-05-15"><a href="#2023-3-————-2023-05-15" class="headerlink" title="2023.3 ———— 2023.05.15"></a>2023.3 ———— 2023.05.15</h1><div class="fj-gallery no-fancybox">
+    <p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/Cache_47bd0dbc6b408903.17bs9522qg5c.webp" alt="Cache_47bd0dbc6b408903"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/Cache_-261cb991a7c7a4fc.2a30pme95qxw.webp" alt="Cache_-261cb991a7c7a4fc"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+
+</div>
+<p>这个版本算是第一次把“婉清”的人设添加到ai绘画中的设定<br>第二张成为我用ai绘画生成头像以来生成的最为细腻的头像<br><psw>（最短命一版，因为游戏上传头像审核不通过，且第二个相比来说很模糊。。。。。。）</psw></p>
+<h1 id="2023-05-15-————-2023-07-01"><a href="#2023-05-15-————-2023-07-01" class="headerlink" title="2023.05.15 ———— 2023.07.01"></a>2023.05.15 ———— 2023.07.01</h1><div class="fj-gallery no-fancybox">
+    <p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230525/psc.tur1juwwcq8.webp" alt="psc"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230525/psc.28fxw2ub7uvw.webp" alt="psc"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+
+</div>
+<p>从这一代开始，弃用“芦雪婉清”这个名字，更名为“凌雪玉清”<br>她的Gacha人设也就是在这一代诞生的 <psw>（我给她换名字是因为原先的“婉清”不适合她的Gacha人设。。。。。。）</psw></p>
+<h1 id="2023-07-01-————-今天"><a href="#2023-07-01-————-今天" class="headerlink" title="2023.07.01 ———— 今天"></a>2023.07.01 ———— 今天</h1><div class="fj-gallery no-fancybox">
+    <p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230704/avatar.221tx2miyvsw.webp" alt="avatar"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+
+</div>
+<p>这一代开始风格大变换，同时启用“王九弦SZ·Ninty”这个名字<br>（“王九弦”是我的笔名，真名等域名备案后揭露）</p>
+]]></content>
+      <categories>
+        <category>个人小记</category>
+      </categories>
+      <tags>
+        <tag>个人小记</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>对于虚拟桌宠模拟器，我的评价（及使用教程）</title>
+    <url>/posts/45875/</url>
+    <content><![CDATA[<h1 id="前言"><a href="#前言" class="headerlink" title="前言"></a>前言</h1><p>最近你们有没有发现我的博客最新文章的图片有个这个可爱的女孩<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240112/VPet-Simulator.Windows_xR8ox39YOB.4ovrsiykkcc.webp" alt="VPet-Simulator"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>其实这不是站点自带的，而是Steam的一个游戏<psw>（严格来讲这不算游戏）</psw>，叫<a href="https://store.steampowered.com/app/1920960/">“虚拟桌宠模拟器”</a><br>在Steam上免费，而且还是在这些免费产品中为数不多支持创意工坊的桌宠</p>
+<h1 id="桌宠功能"><a href="#桌宠功能" class="headerlink" title="桌宠功能"></a>桌宠功能</h1><p>等待文件加载完成后这个桌宠就出现了</p>
+<h2 id="配置皮肤"><a href="#配置皮肤" class="headerlink" title="配置皮肤"></a>配置皮肤</h2><p>默认配置的桌宠角色（也就是上面图片上出现的），叫萝莉斯<br>当然你可以通过创意工坊安装皮肤模组，重启模拟器之后进入桌宠设置<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240112/8drbjTK54F.400jgfz2x4i0.webp" alt="8drbjTK54F"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>然后点击“MOD管理”，选择之前安装的模组（以智乃示例），启用模组并重启软件<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240112/VPet-Simulator.Windows_3KPCHiz3vs.6xjobkz7zl00.webp" alt="VPet-Simulator"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>重启后重新进入设置，在宠物动画里面选择你要的皮肤<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240112/webstorm64_xJuB0l3o6Y.3dtsteftzhm0.webp" alt="webstorm64_xJuB0l3o6Y"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>这个你要多开也不是不可以。。。。。。<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240112/VPet-Simulator.Windows_5m3BAZYtsP.62541160xeo0.webp" alt="VPet-Simulator"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>然后皮肤就更换完成（当然除非你选择了多开）<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240112/VPet-Simulator.Windows_xQQr1wa9LC.5tdmsod59kg0.webp" alt="VPet-Simulator"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<h2 id="数据计算"><a href="#数据计算" class="headerlink" title="数据计算"></a>数据计算</h2><p>这个默认开启数据计算，当然如果你不想一直投喂桌宠的话<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240112/VPet-Simulator.Windows_4eA1iEKWRL.5393s65ip6k0.webp" alt="VPet-Simulator"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<p>这样的话桌宠就不会被影响到心情了，很方便呢</p>
+<h1 id="个人评价"><a href="#个人评价" class="headerlink" title="个人评价"></a>个人评价</h1><p>自从Q宠企鹅下架以来，我的电脑总是缺少了某些会动的东西<br>虽然后面下载了动态壁纸，但总感觉哪里空空的<br>之前我也是过毒霸姬等等各种各样的桌宠，但总感觉也缺了点东西<br>（甚至我之前加入了Q宠复活版内测交流群，虽然现在没什么更新了，所以不要来问我安装包也别问我群号了）</p>
+<p>直到虚拟桌宠模拟器，弥补了那个我当初给Q宠专门留空位的地方<br>（写的不好请见谅）</p>
+]]></content>
+      <categories>
+        <category>游戏相关</category>
+      </categories>
+      <tags>
+        <tag>游戏相关</tag>
+        <tag>Steam游戏</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>本站已经更换新域名</title>
+    <url>/posts/646/</url>
+    <content><![CDATA[<p>自从我微信绑定了银行卡（而且每个月我都会有50块）以来，我都没有舍得用我自己的钱注册域名<br>但这次终于舍得注册域名了，而且注册了3年<br>但原先我在freenom上面注册的域名仍然保留<br>（因为后面要备案才能用国内线路。。。。）</p>
+<p>现在本站已经正式切换到blog.sinzmise.top<br>（www.sinzmise.top的话等我后面重写完个人主页再说）</p>
+]]></content>
+      <categories>
+        <category>站点折腾</category>
+      </categories>
+      <tags>
+        <tag>站点折腾</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>遭殃前的海洋</title>
+    <url>/posts/29196/</url>
+    <content><![CDATA[<p>2023年8月7日，去汕头的海边玩，顺手拍了几张照片<br>却不料，这是海洋遭殃前最后一次拍的照片<br>谨以这些照片，衬托我对海洋的思念<br>（有错别字请见谅）</p>
+<div class="row">
+
+<div class="col-lg-6">
+    <a href="/seas" class="trm-portfolio-item trm-scroll-animation">
+        <div class="trm-cover-frame" style="padding-bottom:80%">
+            <img class="trm-cover no-fancybox" src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230826/1693055324987.6r5gsrqllx00.jpg" alt="Group Image Gallery"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'>
+        </div>
+        <div class="trm-item-description">
+            <div>
+                <h6>遭殃前的海洋</h6>
+                <p style="margin: 5px 0 0;font-size: .9rem;opacity: .8;">这可能是我最后一次拍摄海洋的照片了</p>
+            </div>
+        </div>
+    </a>
+</div>
+</div>
+
+<p>Ade！美丽的海洋，Ade！我向往的美景</p>
+]]></content>
+      <categories>
+        <category>个人小记</category>
+      </categories>
+      <tags>
+        <tag>个人小记</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>盘点我访问过的古老站点</title>
+    <url>/posts/12779/</url>
+    <content><![CDATA[<h1 id="秘密花园（www-yini-org-）"><a href="#秘密花园（www-yini-org-）" class="headerlink" title="秘密花园（www.yini.org ）"></a>秘密花园（www.yini.org ）</h1><p>第一次认识这个站点，还得从我的企划：Prism Online开始——<br>其实这个企划的名字不是我自定的，而是为了纪念zia之前为Win98复活realplayer做的站点：Prism Online<br>这个网页被我保存下来了，又因为是连Win98的IE都能访问，所以页面保存完整：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230706/msedge_NVTZMJiz3k.3fvqvt9mj420.png" alt="msedge_NVTZMJiz3k"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>右上角的“秘密花园网”顿时就让我来了兴趣，<psw>以为这是zia偷偷搞得项目，</psw>就访问了这个站点<br>结果你们看一下时间：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230706/msedge_kjVMokSZhI.ur8solbr9c0.webp" alt="msedge_kjVMokSZhI"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>好家伙1999？那时候我还没出生吧<psw>（我05后，年龄早就说出来了，只不过没加入关于页面而已。。。。。。）</psw></p>
+<p>进入主页（点中间的Enter进入主页，而不是按Enter键！），引入眼帘的是这个页面：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230706/msedge_7JtNIv2lMG.756hl2fhf940.webp" alt="msedge_7JtNIv2lMG"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>伴随着这个页面的出现还有这首歌：<br><div class="audio"><audio controls preload><source src='https://files.blog.sinzmise.top/mp3/love.mp3' type='audio/mp3'>Your browser does not support the audio tag.</audio></div><br>这首歌是Song from a secret garden的钢琴版<br>歌曲的出现，不仅给站点带来了一丝神秘感，还奇妙地契合“秘密花园”这个名字<br><del>（虽然这个版本我不喜欢听，我更喜欢听原版的，原版更有意境）</del></p>
+<p>下面说一下在这个花园里我喜欢的背景音乐（管理者貌似给很多页面设置了独立的背景音乐）<br>1.<a href="http://www.yini.org/museum/museum.htm">秘密花园历史博物馆页面</a><br><div class="audio"><audio controls preload><source src='https://files.blog.sinzmise.top/mp3/SAYGOODBYE.mp3' type='audio/mp3'>Your browser does not support the audio tag.</audio></div><br>这个音乐我查了很久都查不到结果（甚至听歌识别都没有识别到），有谁知道的跟我说一下</p>
+<p>2.<a href="http://www.yini.org/news/news.htm">秘密花园更新记录页面</a><br><div class="audio"><audio controls preload><source src='https://files.blog.sinzmise.top/mp3/hgtc.mp3' type='audio/mp3'>Your browser does not support the audio tag.</audio></div><br>“亲爱的旅人啊”的童声版（冷知识：“亲爱的旅人啊”是always with me的中文填词版，就是为了表达对《千与千寻》的喜爱）</p>
+<p>3.<a href="http://www.yini.org/girl/index.htm">秘密花园少女漫画页面</a><br><div class="audio"><audio controls preload><source src='https://files.blog.sinzmise.top/mp3/xindong.mp3' type='audio/mp3'>Your browser does not support the audio tag.</audio></div><br>这个音乐我查了很久也查不到结果（听歌识别也没有识别到），有谁知道的跟我说一下</p>
+<p>4.<a href="http://www.yini.org/girl/tv/index2.htm">秘密花园欧美动画介绍————愤怒的小鸟</a><br><div class="audio"><audio controls preload><source src='https://files.blog.sinzmise.top/mp3/angry.mp3' type='audio/mp3'>Your browser does not support the audio tag.</audio></div><br>愤怒的小鸟主题曲吉他版（这个旋律。。。。。。爷青回）</p>
+<p>5.<a href="http://www.yini.org/girl/tv/index3.htm">秘密花园中国动画介绍————大鱼海棠</a><br><div class="audio"><audio controls preload><source src='https://files.blog.sinzmise.top/mp3/dayu.mp3' type='audio/mp3'>Your browser does not support the audio tag.</audio></div><br>周深的《大鱼》（没什么多说的，就算是放在2023年都很好听）</p>
+<p>5.<a href="http://www.yini.org/girl/tv/index3.htm">秘密花园中国动画介绍————喜羊羊与灰太狼</a><br><div class="audio"><audio controls preload><source src='https://files.blog.sinzmise.top/mp3/yang.mp3' type='audio/mp3'>Your browser does not support the audio tag.</audio></div><br>喜灰原始世界历险记的主题曲——李紫昕的《知己》（这个主题曲也成为我看喜灰以来最熟悉的主题曲）</p>
+<p>6.<a href="http://www.yini.org/girl/games/index.htm">秘密花园游戏图片————仙剑四（1）</a><br><div class="audio"><audio controls preload><source src='https://files.blog.sinzmise.top/mp3/xianjian1.mp3' type='audio/mp3'>Your browser does not support the audio tag.</audio></div><br>仙剑4主题曲——回梦游仙（这首歌我好像在哪听过。。。。。。等会我父亲好像玩过这游戏，怪不得那么熟悉）</p>
+<p>7.<a href="http://www.yini.org/girl/games/index.htm">秘密花园游戏图片————仙剑四（2）</a><br><div class="audio"><audio controls preload><source src='https://files.blog.sinzmise.top/mp3/xj4.mp3' type='audio/mp3'>Your browser does not support the audio tag.</audio></div><br>回梦游仙（心然版，是仙剑4主题曲的填词版）</p>
+<h1 id="月光软件（www-moon-soft-com-）"><a href="#月光软件（www-moon-soft-com-）" class="headerlink" title="月光软件（www.moon-soft.com ）"></a>月光软件（www.moon-soft.com ）</h1><p>1997年开设的站点，这里面是下载php、asp、jsp等源码<br><del>（虽然收集的源码没有a5下载那么多，但考虑到a5下载是2009年创办的，所以。。。。。。）</del></p>
+<p>这个没有太多介绍的</p>
+<h1 id="sickbaby（www-sickbaby-org-）"><a href="#sickbaby（www-sickbaby-org-）" class="headerlink" title="sickbaby（www.sickbaby.org ）"></a>sickbaby（www.sickbaby.org ）</h1><p>这个是我偶然在知乎上找到的<br>目前我找到的资料：<br>“暗地病孩子”是一个纯文学论坛，由《萌芽》写手路内、七月人等共同创办于1998年6月6日。当年这个网站的影响之大，据说大到“影响了一代人”。到底有没有这么厉害咱也不知道，毕竟这个网站火的时候阿广还没认识多少个字。</p>
+<p>“暗地病孩子”的网页风格阴暗晦涩，黑底白字看得人眼睛发酸。</p>
+<p>该网站是那个时代文青的精神家园，安妮宝贝、小饭、张悦然、周嘉宁、苏德等青年作家都曾在这个论坛发表过文章。</p>
+<p>“暗地病孩子”的用户大多是中学生以及大学生，他们以“病孩子”自居，在这里分享自己的文字、摄影、音乐、画，跟来自全国各地的“病孩子”一起聊天。虽然分享者众多，但网站收录的文艺作品都统一保持着颓废阴郁的风格。</p>
+<p>多年以后，这些病孩子都成家立业了，偶尔当他们记起当年在“暗地病孩子”上认识的某个网友，还会在群里问当年那个“孩子”怎么样了。</p>
+<h1 id="达也小站（http-www-touchcn-com-index-tkm-asp）"><a href="#达也小站（http-www-touchcn-com-index-tkm-asp）" class="headerlink" title="达也小站（http://www.touchcn.com/index_tkm.asp）"></a>达也小站（<a href="http://www.touchcn.com/index_tkm.asp）">http://www.touchcn.com/index_tkm.asp）</a></h1><p>这个好像是一个动漫站点<br>目前已经无法注册，原因：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230706/msedge_GFKmRzRmyk.1k4lh0b8hlfk.webp" alt="msedge_GFKmRzRmyk"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<h1 id="阿江守候（www-ajiang-net-）"><a href="#阿江守候（www-ajiang-net-）" class="headerlink" title="阿江守候（www.ajiang.net ）"></a>阿江守候（www.ajiang.net ）</h1><p>这个也是在知乎上找到的<br>我感觉这个站长是个大佬，他的作品有很多，甚至51la也是他做的<br>这个站点不仅发布者他的动态，甚至有<a href="http://www.ajiang.net/wenxue.htm">“校园文学”</a><br>（要不然怎么是“高校文学爱好者的乐园”呢，不过目前暂不接受投稿了，但留言板还在更新）</p>
+<h1 id="偏执狂金属网（www-paranoidmetal-com-）"><a href="#偏执狂金属网（www-paranoidmetal-com-）" class="headerlink" title="偏执狂金属网（www.paranoidmetal.com ）"></a>偏执狂金属网（www.paranoidmetal.com ）</h1><p>重金属音乐爱好者的站点，没什么好说的</p>
+<h1 id="机动展示联盟MSL中国（cnmsl-net-）"><a href="#机动展示联盟MSL中国（cnmsl-net-）" class="headerlink" title="机动展示联盟MSL中国（cnmsl.net ）"></a>机动展示联盟MSL中国（cnmsl.net ）</h1><p>（请勿理解成那个cnmsl，这个网站全称是China Mobile Suit League，是CN-MSL，不是那个cnmsl。。。。。。）<br>没想到1999年就有人围绕机械和高达搭建了同人站（这好像不算同人站吧），只能说国内高达能吸引那么多人有他们的一份功劳</p>
+<p>还有很多站点就不再说了，再说下去空间不够了</p>
+]]></content>
+      <categories>
+        <category>个人小记</category>
+      </categories>
+      <tags>
+        <tag>个人小记</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>站点装修与国庆小记</title>
+    <url>/posts/10733/</url>
+    <content><![CDATA[<p>国庆假期已经快要收尾了<br>不知道大家过得怎么样呢？<br>不废话，正片开始！</p>
+<h1 id="站点又重新装修"><a href="#站点又重新装修" class="headerlink" title="站点又重新装修"></a>站点又重新装修</h1><p>之前我魔改的那Butterfly主题被人诟病加载慢等等问题<psw>，并且在经过我的“努力”之下成功变成了史山代码</psw><br>因此被迫重新装修</p>
+<p>站点更新如下：</p>
+<ul>
+<li>更换主题为<a href="https://hexo-theme-async.imalun.com/">Hexo-Theme-Async</a>，并且为这个主题适配了IndieWeb，同时也做了一些魔改</li>
+<li>将原先的swpp换成async主题自带sw，并且在此基础上进行适配全站npm化</li>
+<li>添加DocSearch</li>
+</ul>
+<p>很多功能我还没添加，敬请期待！</p>
+<h1 id="第一次去漫展"><a href="#第一次去漫展" class="headerlink" title="第一次去漫展"></a>第一次去漫展</h1><p>之前在微信的朋友圈里面看到了我的一位朋友<br>他要几个人跟他去漫展<br>而且那漫展还是在汕头（离我家很近）<br>于是我想去逛漫展了</p>
+<p>虽然那位朋友在去漫展的路上出事（腰出问题）导致迟到了差不多一个小时<br>不过没关系，我能自己逛逛</p>
+<p>逛逛的过程中顺带买了hina的立牌和大米的谷子<psw>别问为啥没买麻酱和独角兽的谷子，貌似卖完了或者根本没卖（悲）</psw><br>而且还去看了那边的演出（那边的演出是会整活的，给背景音乐混入了几个奇奇怪怪的东西）<br>我那朋友一来我就带他们去卖立牌的地方<br><psw>然后我就看见了这地方还有本子。。。。。。。</psw><br>他们买了几个谷子，我也跟着买了几个谷子和钥匙扣</p>
+<p>收获：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/82245cff3c03cdd649f4b71ea6b8cc1.5tr06yjfnx.webp" alt="四个谷子，一个立牌和两个钥匙扣"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+]]></content>
+      <categories>
+        <category>个人小记</category>
+      </categories>
+      <tags>
+        <tag>个人小记</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>真·彩虹猫加载动画</title>
+    <url>/posts/46640/</url>
+    <content><![CDATA[<h1 id="前言"><a href="#前言" class="headerlink" title="前言"></a>前言</h1><p>之前有人反映我的站点特别卡<br>也不是没有去优化。。。。。但是依然有人说很卡<br>我感觉是加载动画的问题，刚好我之前找到html+css实现彩虹猫<br>于是我给这个抄下来了<br>不废话，正片开始！</p>
+<h1 id="教程开始！"><a href="#教程开始！" class="headerlink" title="教程开始！"></a>教程开始！</h1><h2 id="新建js"><a href="#新建js" class="headerlink" title="新建js"></a>新建js</h2><p>首先，新建<code>[Blogroot]\themes\butterfly\source\js\nyan.js</code>，内容如下：</p>
+<figure class="highlight javascript"><table><tr><td class="code"><pre><span class="line"><span class="keyword">function</span> <span class="title function_">cycleFrames</span> (<span class="params">_nyanCat, _currentFrame</span>) &#123;</span><br><span class="line">	_nyanCat.<span class="property">classList</span> = []</span><br><span class="line">	_nyanCat.<span class="property">classList</span>.<span class="title function_">add</span>(<span class="string">`frame<span class="subst">$&#123;_currentFrame&#125;</span>`</span>)</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="keyword">function</span> <span class="title function_">replicateSparks</span> (<span class="params">_sparksRow</span>) &#123;</span><br><span class="line">	<span class="keyword">const</span> numberOfRowsToCoverEntireScreen = <span class="title class_">Math</span>.<span class="title function_">ceil</span>(<span class="variable language_">document</span>.<span class="title function_">getElementById</span>(<span class="string">&quot;loading-box&quot;</span>).<span class="property">offsetHeight</span> / _sparksRow.<span class="property">offsetHeight</span>)</span><br><span class="line">	<span class="keyword">const</span> newSparksRows = <span class="variable language_">document</span>.<span class="title function_">createElement</span>(<span class="string">&#x27;div&#x27;</span>)</span><br><span class="line"></span><br><span class="line">	<span class="keyword">for</span> (<span class="keyword">let</span> a = <span class="number">0</span>; a &lt; numberOfRowsToCoverEntireScreen-<span class="number">1</span>; a++) &#123;</span><br><span class="line">		newSparksRows.<span class="title function_">append</span>(_sparksRow.<span class="title function_">cloneNode</span>(<span class="literal">true</span>))</span><br><span class="line">	&#125;</span><br><span class="line"></span><br><span class="line">	<span class="variable language_">document</span>.<span class="title function_">getElementById</span>(<span class="string">&quot;loading-box&quot;</span>).<span class="title function_">prepend</span>(newSparksRows)</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line">(<span class="keyword">function</span> (<span class="params"></span>) &#123;</span><br><span class="line">	<span class="keyword">let</span> nyanCat = <span class="variable language_">document</span>.<span class="title function_">getElementById</span>(<span class="string">&#x27;nyan-cat&#x27;</span>)</span><br><span class="line">	<span class="keyword">let</span> currentFrame = <span class="number">1</span></span><br><span class="line"></span><br><span class="line">	<span class="title function_">replicateSparks</span>(<span class="variable language_">document</span>.<span class="title function_">getElementsByClassName</span>(<span class="string">&#x27;sparks-combo&#x27;</span>)[<span class="number">0</span>])</span><br><span class="line"></span><br><span class="line">	<span class="built_in">setInterval</span>(<span class="keyword">function</span> (<span class="params"></span>) &#123;</span><br><span class="line">		currentFrame = (currentFrame % <span class="number">6</span>) + <span class="number">1</span></span><br><span class="line">		<span class="title function_">cycleFrames</span>(nyanCat, currentFrame)</span><br><span class="line">	&#125;, <span class="number">70</span>)</span><br><span class="line">&#125;)()</span><br></pre></td></tr></table></figure>
+<p>这个是用来自动生成div，使得星星可以铺满屏幕</p>
+<h2 id="选择方案"><a href="#选择方案" class="headerlink" title="选择方案"></a>选择方案</h2><p>以下三种方案任意选择一种：</p>
+<h3 id="店长魔改方案"><a href="#店长魔改方案" class="headerlink" title="店长魔改方案"></a>店长魔改方案</h3><p>如果你博客有参考店长的这个教程：<a href="https://akilar.top/posts/3d221bf2/">Loading Animation</a><br>那就按照这个教程魔改就行</p>
+<ol>
+<li>修改<code>[Blogroot]\themes\butterfly\layout\includes\loading\loading.pug</code><figure class="highlight diff"><table><tr><td class="code"><pre><span class="line">if theme.preloader.enable</span><br><span class="line">  case theme.preloader.load_style    </span><br><span class="line">    when &#x27;gear&#x27;</span><br><span class="line">      include ./load_style/gear.pug</span><br><span class="line">    when &#x27;ironheart&#x27;</span><br><span class="line">      include ./load_style/ironheart.pug</span><br><span class="line">    when &#x27;scarecrow&#x27;</span><br><span class="line">      include ./load_style/scarecrow.pug</span><br><span class="line">    when &#x27;triangles&#x27;</span><br><span class="line">      include ./load_style/triangles.pug</span><br><span class="line">    when &#x27;wizard&#x27;</span><br><span class="line">      include ./load_style/wizard.pug</span><br><span class="line">    when &#x27;image&#x27;</span><br><span class="line">      include ./load_style/image.pug</span><br><span class="line"><span class="addition">+    when &#x27;nyancat&#x27;</span></span><br><span class="line"><span class="addition">+      include ./load_style/nyancat.pug</span></span><br><span class="line">    default</span><br><span class="line">      include ./load_style/default.pug</span><br></pre></td></tr></table></figure></li>
+<li>新建[Blogroot]\themes\butterfly\layout\includes\loading\load_style\nyancat.pug，内容如下：<figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line">#loading-box(onclick=&#x27;document.getElementById(&quot;loading-box&quot;).classList.add(&quot;loaded&quot;)&#x27;)</span><br><span class="line">    .sparks-combo</span><br><span class="line">        .spark</span><br><span class="line">        .spark</span><br><span class="line">        .spark</span><br><span class="line">        .spark</span><br><span class="line">    .rainbow</span><br><span class="line">        span</span><br><span class="line">    .nyan-cat</span><br><span class="line">        .feet</span><br><span class="line">        .tail</span><br><span class="line">            span</span><br><span class="line">        .body</span><br><span class="line">        .head</span><br><span class="line">    script(src=&quot;/js/nyan.js&quot;)</span><br><span class="line"></span><br><span class="line">script.</span><br><span class="line">    const preloader = &#123;</span><br><span class="line">        endLoading: () =&gt; &#123;</span><br><span class="line">            document.body.style.overflow = &#x27;auto&#x27;;</span><br><span class="line">            document.getElementById(&#x27;loading-box&#x27;).classList.add(&quot;loaded&quot;)</span><br><span class="line">        &#125;,</span><br><span class="line">        initLoading: () =&gt; &#123;</span><br><span class="line">            document.body.style.overflow = &#x27;&#x27;;</span><br><span class="line">            document.getElementById(&#x27;loading-box&#x27;).classList.remove(&quot;loaded&quot;)</span><br><span class="line"></span><br><span class="line">        &#125;</span><br><span class="line">    &#125;</span><br><span class="line">    window.addEventListener(&#x27;load&#x27;,()=&gt; &#123; preloader.endLoading() &#125;)</span><br><span class="line"></span><br><span class="line">    if (!&#123;theme.pjax &amp;&amp; theme.pjax.enable&#125;) &#123;</span><br><span class="line">        document.addEventListener(&#x27;pjax:send&#x27;, () =&gt; &#123; preloader.initLoading() &#125;)</span><br><span class="line">        document.addEventListener(&#x27;pjax:complete&#x27;, () =&gt; &#123; preloader.endLoading() &#125;)</span><br><span class="line">    &#125;</span><br></pre></td></tr></table></figure></li>
+<li>修改<code>[Blogroot]\themes\butterfly\source\css\_layout\loading.styl</code><figure class="highlight diff"><table><tr><td class="code"><pre><span class="line"></span><br><span class="line">if hexo-config(&#x27;preloader.enable&#x27;)</span><br><span class="line">  if hexo-config(&#x27;preloader.load_style&#x27;) == &#x27;gear&#x27;</span><br><span class="line">    @import &#x27;./_load_style/gear&#x27;</span><br><span class="line">  else if hexo-config(&#x27;preloader.load_style&#x27;) == &#x27;ironheart&#x27;</span><br><span class="line">    @import &#x27;./_load_style/ironheart&#x27;</span><br><span class="line">  else if hexo-config(&#x27;preloader.load_style&#x27;) == &#x27;scarecrow&#x27;</span><br><span class="line">    @import &#x27;./_load_style/scarecrow&#x27;</span><br><span class="line">  else if hexo-config(&#x27;preloader.load_style&#x27;) == &#x27;triangles&#x27;</span><br><span class="line">    @import &#x27;./_load_style/triangles&#x27;</span><br><span class="line">  else if hexo-config(&#x27;preloader.load_style&#x27;) == &#x27;wizard&#x27;</span><br><span class="line">    @import &#x27;./_load_style/wizard&#x27;</span><br><span class="line">  else if hexo-config(&#x27;preloader.load_style&#x27;) == &#x27;image&#x27;</span><br><span class="line">    @import &#x27;./_load_style/image&#x27;</span><br><span class="line"><span class="addition">+  else if hexo-config(&#x27;preloader.load_style&#x27;) == &#x27;nyancat&#x27;</span></span><br><span class="line"><span class="addition">+    @import &#x27;./_load_style/nyancat&#x27;</span></span><br><span class="line">  else</span><br><span class="line">    @import &#x27;./_load_style/default&#x27;</span><br></pre></td></tr></table></figure></li>
+<li>新建<code>[Blogroot]\themes\butterfly\source\css\_load_style\nyancat.styl</code>，内容如下：</li>
+</ol>
+<figure class="highlight stylus"><table><tr><td class="code"><pre><span class="line"><span class="selector-id">#loading-box</span></span><br><span class="line">  <span class="attribute">width</span>: <span class="number">100%</span>;</span><br><span class="line">  <span class="attribute">height</span>: <span class="number">100%</span>;</span><br><span class="line">  <span class="attribute">margin</span>: <span class="number">0</span>;</span><br><span class="line">  <span class="attribute">padding</span>: <span class="number">0</span>;</span><br><span class="line">  <span class="attribute">background</span>: <span class="number">#036</span>;</span><br><span class="line">  <span class="attribute">overflow</span>: hidden;</span><br><span class="line">  <span class="attribute">position</span> : fixed;</span><br><span class="line">  <span class="attribute">font</span>: <span class="number">13px</span>/<span class="number">1.4</span> Helvetica, arial, freesans, clean, sans-serif, <span class="string">&quot;Segoe UI Emoji&quot;</span>, <span class="string">&quot;Segoe UI Symbol&quot;</span>;</span><br><span class="line">  <span class="attribute">z-index</span>: <span class="number">9999</span>;</span><br><span class="line">  <span class="attribute">opacity</span>: <span class="number">1</span>;</span><br><span class="line"></span><br><span class="line">  &amp;<span class="selector-class">.loaded</span></span><br><span class="line">    <span class="attribute">opacity</span>: <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">z-index</span>: -<span class="number">1000</span>;</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.sprite</span>, <span class="selector-class">.body</span>, <span class="selector-class">.head</span>, <span class="selector-class">.rainbow</span> <span class="selector-tag">span</span>, <span class="selector-class">.feet</span>, <span class="selector-class">.tail</span> <span class="selector-tag">span</span>, <span class="selector-class">.stars</span> <span class="selector-class">.star</span></span><br><span class="line">    <span class="attribute">position</span>: absolute;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0px</span>,<span class="number">0</span> <span class="number">5px</span>,<span class="number">0</span> <span class="number">10px</span>,<span class="number">0</span> <span class="number">15px</span>,<span class="number">0</span> <span class="number">20px</span>,<span class="number">0</span> <span class="number">25px</span>,<span class="number">0</span> <span class="number">30px</span>,<span class="number">0</span> <span class="number">35px</span>,<span class="number">0</span> <span class="number">40px</span>,<span class="number">0</span> <span class="number">45px</span>,<span class="number">0</span> <span class="number">50px</span>,<span class="number">0</span> <span class="number">55px</span>,<span class="number">0</span> <span class="number">60px</span>,<span class="number">0</span> <span class="number">65px</span>,<span class="number">0</span> <span class="number">70px</span>,<span class="number">0</span> <span class="number">75px</span>,<span class="number">0</span> <span class="number">80px</span>,<span class="number">0</span> <span class="number">85px</span>,<span class="number">0</span> <span class="number">90px</span>,<span class="number">0</span> <span class="number">95px</span>,<span class="number">0</span> <span class="number">100px</span>,<span class="number">0</span> <span class="number">105px</span>,<span class="number">0</span> <span class="number">110px</span>,<span class="number">0</span> <span class="number">115px</span>,<span class="number">0</span> <span class="number">120px</span>,<span class="number">0</span> <span class="number">125px</span>;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">100%</span> <span class="number">5px</span>;</span><br><span class="line">    <span class="attribute">background-repeat</span>: no-repeat;</span><br><span class="line"></span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.nyan-cat</span></span><br><span class="line">    <span class="attribute">position</span>: fixed;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">50%</span>;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">50%</span>;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">165px</span>;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">100px</span>;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">50px</span>;</span><br><span class="line">    <span class="attribute">margin-left</span>: -<span class="number">82px</span>;</span><br><span class="line">    -webkit-<span class="attribute">animation</span>: nyan <span class="number">400ms</span> step-start infinite;</span><br><span class="line">    <span class="attribute">animation</span>: nyan <span class="number">400ms</span> step-start infinite;</span><br><span class="line">    <span class="attribute">z-index</span>: <span class="number">19999</span>;</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.body</span></span><br><span class="line">    <span class="attribute">left</span>: <span class="number">35px</span>;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">105px</span>;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">90px</span>;</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.head</span></span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">80px</span>;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">65px</span>;</span><br><span class="line">    -webkit-<span class="attribute">animation</span>: head <span class="number">400ms</span> linear infinite;</span><br><span class="line">    <span class="attribute">animation</span>: head <span class="number">400ms</span> linear infinite;</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.rainbow</span></span><br><span class="line">    <span class="attribute">position</span>: fixed;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">50%</span>;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">35px</span>;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">50%</span>;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">65px</span>;</span><br><span class="line">    <span class="attribute">overflow</span>: hidden;</span><br><span class="line">    <span class="attribute">z-index</span>: <span class="number">18888</span>;</span><br><span class="line"></span><br><span class="line">    <span class="selector-tag">span</span></span><br><span class="line">      <span class="attribute">display</span>: block;</span><br><span class="line">      <span class="attribute">position</span>: relative;</span><br><span class="line">      <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">      <span class="attribute">width</span>: <span class="number">100%</span>;</span><br><span class="line">      <span class="attribute">height</span>: <span class="number">130px</span>;</span><br><span class="line">      <span class="attribute">background-size</span>: <span class="number">80px</span> <span class="number">5px</span>;</span><br><span class="line">      <span class="attribute">background-repeat</span>: repeat-x;</span><br><span class="line">      -webkit-<span class="attribute">animation</span>: rainbow <span class="number">400ms</span> step-start infinite;</span><br><span class="line">      <span class="attribute">animation</span>: rainbow <span class="number">400ms</span> step-start infinite;</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.feet</span></span><br><span class="line">    <span class="attribute">left</span>: <span class="number">20px</span>;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">75px</span>;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">120px</span>;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">25px</span>;</span><br><span class="line">    -webkit-<span class="attribute">animation</span>: feet <span class="number">400ms</span> infinite;</span><br><span class="line">    <span class="attribute">animation</span>: feet <span class="number">400ms</span> infinite;</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.tail</span></span><br><span class="line">    <span class="attribute">position</span>: relative;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">30px</span>;</span><br><span class="line">    <span class="attribute">overflow</span>: hidden;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">30px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">10px</span>;</span><br><span class="line"></span><br><span class="line">    <span class="selector-tag">span</span></span><br><span class="line">      <span class="attribute">width</span>: <span class="number">25px</span>;</span><br><span class="line">      <span class="attribute">height</span>: <span class="number">120px</span>;</span><br><span class="line">      -webkit-<span class="attribute">animation</span>: tail <span class="number">200ms</span> step-start infinite alternate;</span><br><span class="line">      <span class="attribute">animation</span>: tail <span class="number">200ms</span> step-start infinite alternate;</span><br><span class="line">  </span><br><span class="line">  <span class="selector-class">.sparks-combo</span> </span><br><span class="line">    <span class="attribute">height</span>: <span class="number">300px</span>;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">200%</span>;</span><br><span class="line">    <span class="attribute">position</span>: relative;</span><br><span class="line">    <span class="attribute">animation</span>: woosh <span class="number">700ms</span> <span class="number">0ms</span> linear infinite both;</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.spark</span> </span><br><span class="line">    <span class="attribute">z-index</span>: <span class="number">1</span>;</span><br><span class="line">    <span class="attribute">position</span>: absolute;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">100%</span>;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">100%</span>;</span><br><span class="line">    <span class="attribute">background-color</span>: transparent;</span><br><span class="line">    <span class="attribute">background</span>: <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">6px</span>, transparent <span class="number">6px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">6px</span>, transparent <span class="number">6px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">6px</span>, transparent <span class="number">6px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">6px</span>, transparent <span class="number">6px</span>, transparent <span class="number">400px</span>) repeat-x;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:before</span> </span><br><span class="line">      <span class="attribute">background</span>: <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">5px</span>, transparent <span class="number">5px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">5px</span>, transparent <span class="number">5px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">5px</span>, transparent <span class="number">5px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">5px</span>, transparent <span class="number">5px</span>, transparent <span class="number">400px</span>) repeat-x;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:after</span> </span><br><span class="line">      <span class="attribute">background</span>: <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">6px</span>, transparent <span class="number">6px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">6px</span>, transparent <span class="number">6px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">11px</span>, transparent <span class="number">11px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">11px</span>, transparent <span class="number">11px</span>, transparent <span class="number">400px</span>) repeat-x;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:before</span>,<span class="selector-pseudo">&amp;:after</span> </span><br><span class="line">      <span class="attribute">content</span>: <span class="string">&#x27;&#x27;</span>;</span><br><span class="line">      <span class="attribute">position</span>: absolute;</span><br><span class="line">      <span class="attribute">width</span>: <span class="number">100%</span>;</span><br><span class="line">      <span class="attribute">height</span>: <span class="number">100%</span>;</span><br><span class="line">      <span class="attribute">background-color</span>: transparent;</span><br><span class="line">    </span><br><span class="line">    </span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">1</span>) </span><br><span class="line">      <span class="attribute">z-index</span>: <span class="number">3</span>;</span><br><span class="line">      <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">      <span class="attribute">left</span>: <span class="number">20px</span>;</span><br><span class="line">      <span class="attribute">animation</span>: sparkly <span class="number">700ms</span> <span class="number">0ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">1</span>)<span class="selector-pseudo">:before</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-before <span class="number">700ms</span> <span class="number">0ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">1</span>)<span class="selector-pseudo">:after</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-after <span class="number">700ms</span> <span class="number">0ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">2</span>) </span><br><span class="line">      <span class="attribute">top</span>: <span class="number">40px</span>;</span><br><span class="line">      <span class="attribute">left</span>: <span class="number">170px</span>;</span><br><span class="line">      <span class="attribute">animation</span>: sparkly <span class="number">700ms</span> <span class="number">200ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">2</span>)<span class="selector-pseudo">:before</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-before <span class="number">700ms</span> <span class="number">200ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">2</span>)<span class="selector-pseudo">:after</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-after <span class="number">700ms</span> <span class="number">200ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">3</span>) </span><br><span class="line">      <span class="attribute">top</span>: <span class="number">100px</span>;</span><br><span class="line">      <span class="attribute">left</span>: <span class="number">320px</span>;</span><br><span class="line">      <span class="attribute">animation</span>: sparkly <span class="number">700ms</span> <span class="number">400ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">3</span>)<span class="selector-pseudo">:before</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-before <span class="number">700ms</span> <span class="number">400ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">3</span>)<span class="selector-pseudo">:after</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-after <span class="number">700ms</span> <span class="number">400ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">4</span>) </span><br><span class="line">      <span class="attribute">top</span>: <span class="number">150px</span>;</span><br><span class="line">      <span class="attribute">left</span>: <span class="number">200px</span>;</span><br><span class="line">      <span class="attribute">animation</span>: sparkly <span class="number">700ms</span> <span class="number">600ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">4</span>)<span class="selector-pseudo">:before</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-before <span class="number">700ms</span> <span class="number">600ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">4</span>)<span class="selector-pseudo">:after</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-after <span class="number">700ms</span> <span class="number">600ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.body</span></span><br><span class="line">    <span class="attribute">background-image</span>: <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#000000</span> <span class="number">95px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">100px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">20px</span>, <span class="number">#fe91fe</span> <span class="number">20px</span>, <span class="number">#fe91fe</span> <span class="number">85px</span>, <span class="number">#f9d28f</span> <span class="number">85px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">15px</span>, <span class="number">#fe91fe</span> <span class="number">15px</span>, <span class="number">#fe91fe</span> <span class="number">45px</span>, <span class="number">#f90297</span> <span class="number">45px</span>, <span class="number">#f90297</span> <span class="number">50px</span>, <span class="number">#fe91fe</span> <span class="number">50px</span>, <span class="number">#fe91fe</span> <span class="number">60px</span>, <span class="number">#f90297</span> <span class="number">60px</span>, <span class="number">#f90297</span> <span class="number">65px</span>, <span class="number">#fe91fe</span> <span class="number">65px</span>, <span class="number">#fe91fe</span> <span class="number">90px</span>, <span class="number">#f9d28f</span> <span class="number">90px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">20px</span>, <span class="number">#f90297</span> <span class="number">20px</span>, <span class="number">#f90297</span> <span class="number">25px</span>, <span class="number">#fe91fe</span> <span class="number">25px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">80px</span>, <span class="number">#f90297</span> <span class="number">80px</span>, <span class="number">#f90297</span> <span class="number">85px</span>, <span class="number">#fe91fe</span> <span class="number">85px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">40px</span>, <span class="number">#f90297</span> <span class="number">40px</span>, <span class="number">#f90297</span> <span class="number">45px</span>, <span class="number">#fe91fe</span> <span class="number">45px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">25px</span>, <span class="number">#f90297</span> <span class="number">25px</span>, <span class="number">#f90297</span> <span class="number">30px</span>, <span class="number">#fe91fe</span> <span class="number">30px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">45px</span>, <span class="number">#f90297</span> <span class="number">45px</span>, <span class="number">#f90297</span> <span class="number">50px</span>, <span class="number">#fe91fe</span> <span class="number">50px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">15px</span>, <span class="number">#f90297</span> <span class="number">15px</span>, <span class="number">#f90297</span> <span class="number">20px</span>, <span class="number">#fe91fe</span> <span class="number">20px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">35px</span>, <span class="number">#f90297</span> <span class="number">35px</span>, <span class="number">#f90297</span> <span class="number">40px</span>, <span class="number">#fe91fe</span> <span class="number">40px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">15px</span>, <span class="number">#fe91fe</span> <span class="number">15px</span>, <span class="number">#fe91fe</span> <span class="number">20px</span>, <span class="number">#f90297</span> <span class="number">20px</span>, <span class="number">#f90297</span> <span class="number">25px</span>, <span class="number">#fe91fe</span> <span class="number">25px</span>, <span class="number">#fe91fe</span> <span class="number">90px</span>, <span class="number">#f9d28f</span> <span class="number">90px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">20px</span>, <span class="number">#fe91fe</span> <span class="number">20px</span>, <span class="number">#fe91fe</span> <span class="number">85px</span>, <span class="number">#f9d28f</span> <span class="number">85px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#000000</span> <span class="number">95px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">100px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">105px</span>);</span><br><span class="line">    </span><br><span class="line">  <span class="selector-class">.head</span> </span><br><span class="line">    <span class="attribute">background-image</span>: <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">20px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">60px</span>, <span class="number">#000000</span> <span class="number">60px</span>, <span class="number">#000000</span> <span class="number">70px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">70px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">25px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">25px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">55px</span>, <span class="number">#000000</span> <span class="number">55px</span>, <span class="number">#000000</span> <span class="number">60px</span>, <span class="number">#9d9d9d</span> <span class="number">60px</span>, <span class="number">#9d9d9d</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">30px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">30px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">50px</span>, <span class="number">#000000</span> <span class="number">50px</span>, <span class="number">#000000</span> <span class="number">55px</span>, <span class="number">#9d9d9d</span> <span class="number">55px</span>, <span class="number">#9d9d9d</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">30px</span>, <span class="number">#000000</span> <span class="number">30px</span>, <span class="number">#000000</span> <span class="number">35px</span>, <span class="number">#000000</span> <span class="number">35px</span>, <span class="number">#000000</span> <span class="number">50px</span>, <span class="number">#9d9d9d</span> <span class="number">50px</span>, <span class="number">#9d9d9d</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#ffffff</span> <span class="number">20px</span>, <span class="number">#ffffff</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">55px</span>, <span class="number">#ffffff</span> <span class="number">55px</span>, <span class="number">#ffffff</span> <span class="number">60px</span>, <span class="number">#000000</span> <span class="number">60px</span>, <span class="number">#000000</span> <span class="number">65px</span>, <span class="number">#9d9d9d</span> <span class="number">65px</span>, <span class="number">#9d9d9d</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">45px</span>, <span class="number">#000000</span> <span class="number">45px</span>, <span class="number">#000000</span> <span class="number">50px</span>, <span class="number">#9d9d9d</span> <span class="number">50px</span>, <span class="number">#9d9d9d</span> <span class="number">55px</span>, <span class="number">#000000</span> <span class="number">55px</span>, <span class="number">#000000</span> <span class="number">65px</span>, <span class="number">#9d9d9d</span> <span class="number">65px</span>, <span class="number">#9d9d9d</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#ff9593</span> <span class="number">10px</span>, <span class="number">#ff9593</span> <span class="number">20px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#9d9d9d</span> <span class="number">65px</span>, <span class="number">#ff9593</span> <span class="number">65px</span>, <span class="number">#ff9593</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#ff9593</span> <span class="number">10px</span>, <span class="number">#ff9593</span> <span class="number">20px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#9d9d9d</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">40px</span>, <span class="number">#000000</span> <span class="number">40px</span>, <span class="number">#000000</span> <span class="number">45px</span>, <span class="number">#9d9d9d</span> <span class="number">45px</span>, <span class="number">#9d9d9d</span> <span class="number">55px</span>, <span class="number">#000000</span> <span class="number">55px</span>, <span class="number">#000000</span> <span class="number">60px</span>, <span class="number">#9d9d9d</span> <span class="number">60px</span>, <span class="number">#9d9d9d</span> <span class="number">65px</span>, <span class="number">#ff9593</span> <span class="number">65px</span>, <span class="number">#ff9593</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">60px</span>, <span class="number">#9d9d9d</span> <span class="number">60px</span>, <span class="number">#9d9d9d</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="number">#9d9d9d</span> <span class="number">15px</span>, <span class="number">#9d9d9d</span> <span class="number">65px</span>, <span class="number">#000000</span> <span class="number">65px</span>, <span class="number">#000000</span> <span class="number">70px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">70px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">65px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">65px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>);</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.rainbow</span> &gt; <span class="selector-tag">span</span> </span><br><span class="line">    <span class="attribute">background-image</span>: <span class="built_in">linear-gradient</span>(to right, <span class="number">#fe0000</span> <span class="number">0%</span>, <span class="number">#fe0000</span> <span class="number">50%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">50%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#fe0000</span> <span class="number">0%</span>, <span class="number">#fe0000</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffa500</span> <span class="number">0%</span>, <span class="number">#ffa500</span> <span class="number">50%</span>, <span class="number">#fe0000</span> <span class="number">50%</span>, <span class="number">#fe0000</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffa500</span> <span class="number">0%</span>, <span class="number">#ffa500</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffff00</span> <span class="number">0%</span>, <span class="number">#ffff00</span> <span class="number">50%</span>, <span class="number">#ffa500</span> <span class="number">50%</span>, <span class="number">#ffa500</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffff00</span> <span class="number">0%</span>, <span class="number">#ffff00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#00fb00</span> <span class="number">0%</span>, <span class="number">#00fb00</span> <span class="number">50%</span>, <span class="number">#ffff00</span> <span class="number">50%</span>, <span class="number">#ffff00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#00fb00</span> <span class="number">0%</span>, <span class="number">#00fb00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#009eff</span> <span class="number">0%</span>, <span class="number">#009eff</span> <span class="number">50%</span>, <span class="number">#00fb00</span> <span class="number">50%</span>, <span class="number">#00fb00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#009eff</span> <span class="number">0%</span>, <span class="number">#009eff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#6531ff</span> <span class="number">0%</span>, <span class="number">#6531ff</span> <span class="number">50%</span>, <span class="number">#009eff</span> <span class="number">50%</span>, <span class="number">#009eff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#6531ff</span> <span class="number">0%</span>, <span class="number">#6531ff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">50%</span>, <span class="number">#6531ff</span> <span class="number">50%</span>, <span class="number">#6531ff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">50%</span>, <span class="number">#fe0000</span> <span class="number">50%</span>, <span class="number">#fe0000</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#fe0000</span> <span class="number">0%</span>, <span class="number">#fe0000</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#fe0000</span> <span class="number">0%</span>, <span class="number">#fe0000</span> <span class="number">50%</span>, <span class="number">#ffa500</span> <span class="number">50%</span>, <span class="number">#ffa500</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffa500</span> <span class="number">0%</span>, <span class="number">#ffa500</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffa500</span> <span class="number">0%</span>, <span class="number">#ffa500</span> <span class="number">50%</span>, <span class="number">#ffff00</span> <span class="number">50%</span>, <span class="number">#ffff00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffff00</span> <span class="number">0%</span>, <span class="number">#ffff00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffff00</span> <span class="number">0%</span>, <span class="number">#ffff00</span> <span class="number">50%</span>, <span class="number">#00fb00</span> <span class="number">50%</span>, <span class="number">#00fb00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#00fb00</span> <span class="number">0%</span>, <span class="number">#00fb00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#00fb00</span> <span class="number">0%</span>, <span class="number">#00fb00</span> <span class="number">50%</span>, <span class="number">#009eff</span> <span class="number">50%</span>, <span class="number">#009eff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#009eff</span> <span class="number">0%</span>, <span class="number">#009eff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#009eff</span> <span class="number">0%</span>, <span class="number">#009eff</span> <span class="number">50%</span>, <span class="number">#6531ff</span> <span class="number">50%</span>, <span class="number">#6531ff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#6531ff</span> <span class="number">0%</span>, <span class="number">#6531ff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#6531ff</span> <span class="number">0%</span>, <span class="number">#6531ff</span> <span class="number">50%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">50%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">100%</span>);</span><br><span class="line"></span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.feet</span> </span><br><span class="line">    <span class="attribute">background-image</span>: <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">25px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">25px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">120px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">110px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">110px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">120px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">35px</span>, <span class="number">#9d9d9d</span> <span class="number">35px</span>, <span class="number">#9d9d9d</span> <span class="number">40px</span>, <span class="number">#000000</span> <span class="number">40px</span>, <span class="number">#000000</span> <span class="number">80px</span>, <span class="number">#9d9d9d</span> <span class="number">80px</span>, <span class="number">#9d9d9d</span> <span class="number">110px</span>, <span class="number">#000000</span> <span class="number">110px</span>, <span class="number">#000000</span> <span class="number">115px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">115px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">120px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">20px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">40px</span>, <span class="number">#000000</span> <span class="number">40px</span>, <span class="number">#000000</span> <span class="number">45px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">45px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">80px</span>, <span class="number">#9d9d9d</span> <span class="number">80px</span>, <span class="number">#9d9d9d</span> <span class="number">90px</span>, <span class="number">#000000</span> <span class="number">90px</span>, <span class="number">#000000</span> <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>, <span class="number">#9d9d9d</span> <span class="number">105px</span>, <span class="number">#9d9d9d</span> <span class="number">115px</span>, <span class="number">#000000</span> <span class="number">115px</span>, <span class="number">#000000</span> <span class="number">120px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">15px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">30px</span>, <span class="number">#000000</span> <span class="number">30px</span>, <span class="number">#000000</span> <span class="number">45px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">45px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>, <span class="number">#000000</span> <span class="number">80px</span>, <span class="number">#000000</span> <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">105px</span>, <span class="number">#000000</span> <span class="number">105px</span>, <span class="number">#000000</span> <span class="number">120px</span>);</span><br><span class="line"></span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.tail</span> &gt; <span class="selector-tag">span</span> </span><br><span class="line">    <span class="attribute">background-image</span>: <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">15px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">25px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="number">#9d9d9d</span> <span class="number">15px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">15px</span>);</span><br><span class="line"></span><br><span class="line"><span class="keyword">@-webkit-keyframes</span> rainbow &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">65px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="keyword">@keyframes</span> rainbow &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">65px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@-webkit-keyframes</span> nyan &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">50px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">10%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">50px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">80%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">53px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">50px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> nyan &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">50px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">10%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">50px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">80%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">53px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">50px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@-webkit-keyframes</span> feet &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">20px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">30px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> feet &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">20px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">30px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@-webkit-keyframes</span> head &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">24.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">25%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">88px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">49.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">88px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">74.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">75%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">82px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">99.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">82px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> head &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">24.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">25%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">88px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">49.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">88px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">74.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">75%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">82px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">99.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">82px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@-webkit-keyframes</span> tail &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">25%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">49.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">30px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">74.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">30px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">75%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">60px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">99.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">60px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">90px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> tail &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">25%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">49.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">30px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">74.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">30px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">75%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">60px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">99.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">60px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">90px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> woosh &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">0px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">left</span>: -<span class="number">400px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> sparkly &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">6px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">17px</span> <span class="number">17px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">16%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">17px</span> <span class="number">0</span>, <span class="number">34px</span> <span class="number">17px</span>, <span class="number">17px</span> <span class="number">34px</span>, <span class="number">0</span> <span class="number">17px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">33%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">17px</span> <span class="number">0</span>, <span class="number">34px</span> <span class="number">17px</span>, <span class="number">17px</span> <span class="number">34px</span>, <span class="number">0</span> <span class="number">17px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">6px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">17px</span> <span class="number">17px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">66%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">11px</span>, <span class="number">400px</span> <span class="number">11px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">17px</span> <span class="number">6px</span>, <span class="number">17px</span> <span class="number">23px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">83%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">400px</span> <span class="number">5px</span>, <span class="number">400px</span> <span class="number">5px</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">11px</span> <span class="number">17px</span>, <span class="number">22px</span> <span class="number">17px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">6px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">17px</span> <span class="number">17px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> sparkly-before &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">16%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">33%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">5px</span>, <span class="number">400px</span> <span class="number">5px</span>, <span class="number">400px</span> <span class="number">5px</span>, <span class="number">400px</span> <span class="number">5px</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">6px</span> <span class="number">6px</span>, <span class="number">29px</span> <span class="number">6px</span>, <span class="number">29px</span> <span class="number">29px</span>, <span class="number">6px</span> <span class="number">29px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">66%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">83%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">400px</span> <span class="number">5px</span>, <span class="number">400px</span> <span class="number">5px</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">17px</span> <span class="number">12px</span>, <span class="number">17px</span> <span class="number">22px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> sparkly-after &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">16%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">33%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">11px</span>, <span class="number">400px</span> <span class="number">11px</span>, <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">17px</span> <span class="number">0</span>, <span class="number">17px</span> <span class="number">29px</span>, <span class="number">0</span> <span class="number">17px</span>, <span class="number">29px</span> <span class="number">17px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">66%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">6px</span> <span class="number">17px</span>, <span class="number">23px</span> <span class="number">17px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">83%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
+<ol>
+<li>修改<code>[Blogroot]\_config.butterfly.yml</code>的<code>preloader.load_style</code>配置项<figure class="highlight yml"><table><tr><td class="code"><pre><span class="line"><span class="attr">preloader:</span></span><br><span class="line">  <span class="attr">enable:</span> <span class="literal">true</span></span><br><span class="line">  <span class="attr">load_color:</span> <span class="string">&#x27;#000000&#x27;</span> <span class="comment"># &#x27;#37474f&#x27;</span></span><br><span class="line">  <span class="attr">load_style:</span> <span class="string">nyancat</span> <span class="comment"># 这边改成nyancat</span></span><br></pre></td></tr></table></figure>
+</li>
+</ol>
+<h3 id="butterfly-4-5-以上方案"><a href="#butterfly-4-5-以上方案" class="headerlink" title="butterfly 4.5 以上方案"></a>butterfly 4.5 以上方案</h3><ol>
+<li>修改<code>[Blogroot]\themes\butterfly\layout\includes\loading\fullpage-loading.pug</code>，复制以下代码替换全部内容。<figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line">#loading-box(onclick=&#x27;document.getElementById(&quot;loading-box&quot;).classList.add(&quot;loaded&quot;)&#x27;)</span><br><span class="line">    .sparks-combo</span><br><span class="line">        .spark</span><br><span class="line">        .spark</span><br><span class="line">        .spark</span><br><span class="line">        .spark</span><br><span class="line">    .rainbow</span><br><span class="line">        span</span><br><span class="line">    .nyan-cat</span><br><span class="line">        .feet</span><br><span class="line">        .tail</span><br><span class="line">            span</span><br><span class="line">        .body</span><br><span class="line">        .head</span><br><span class="line">    script(src=&quot;/js/nyan.js&quot;)</span><br><span class="line"></span><br><span class="line">script.</span><br><span class="line">    const preloader = &#123;</span><br><span class="line">        endLoading: () =&gt; &#123;</span><br><span class="line">            document.body.style.overflow = &#x27;auto&#x27;;</span><br><span class="line">            document.getElementById(&#x27;loading-box&#x27;).classList.add(&quot;loaded&quot;)</span><br><span class="line">        &#125;,</span><br><span class="line">        initLoading: () =&gt; &#123;</span><br><span class="line">            document.body.style.overflow = &#x27;&#x27;;</span><br><span class="line">            document.getElementById(&#x27;loading-box&#x27;).classList.remove(&quot;loaded&quot;)</span><br><span class="line"></span><br><span class="line">        &#125;</span><br><span class="line">    &#125;</span><br><span class="line">    window.addEventListener(&#x27;load&#x27;,()=&gt; &#123; preloader.endLoading() &#125;)</span><br><span class="line"></span><br><span class="line">    if (!&#123;theme.pjax &amp;&amp; theme.pjax.enable&#125;) &#123;</span><br><span class="line">        document.addEventListener(&#x27;pjax:send&#x27;, () =&gt; &#123; preloader.initLoading() &#125;)</span><br><span class="line">        document.addEventListener(&#x27;pjax:complete&#x27;, () =&gt; &#123; preloader.endLoading() &#125;)</span><br><span class="line">    &#125;</span><br></pre></td></tr></table></figure></li>
+<li>修改<code>[Blogroot]\themes\butterfly\layout\includes\loading\index.pug</code>，复制以下代码替换全部内容。<figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line">if theme.preloader.source === 1</span><br><span class="line">  include ./fullpage-loading.pug</span><br><span class="line">else if theme.preloader.source === 2</span><br><span class="line">  include ./pace.pug</span><br><span class="line">else</span><br><span class="line">  include ./fullpage-loading.pug</span><br><span class="line">  include ./pace.pug</span><br></pre></td></tr></table></figure></li>
+<li>修改<code>[Blogroot]\themes\butterfly\source\css\_layout\loading.styl</code>，复制以下代码替换全部内容。<figure class="highlight stylus"><table><tr><td class="code"><pre><span class="line"><span class="selector-id">#loading-box</span></span><br><span class="line">  <span class="attribute">width</span>: <span class="number">100%</span>;</span><br><span class="line">  <span class="attribute">height</span>: <span class="number">100%</span>;</span><br><span class="line">  <span class="attribute">margin</span>: <span class="number">0</span>;</span><br><span class="line">  <span class="attribute">padding</span>: <span class="number">0</span>;</span><br><span class="line">  <span class="attribute">background</span>: <span class="number">#036</span>;</span><br><span class="line">  <span class="attribute">overflow</span>: hidden;</span><br><span class="line">  <span class="attribute">position</span> : fixed;</span><br><span class="line">  <span class="attribute">font</span>: <span class="number">13px</span>/<span class="number">1.4</span> Helvetica, arial, freesans, clean, sans-serif, <span class="string">&quot;Segoe UI Emoji&quot;</span>, <span class="string">&quot;Segoe UI Symbol&quot;</span>;</span><br><span class="line">  <span class="attribute">z-index</span>: <span class="number">9999</span>;</span><br><span class="line">  <span class="attribute">opacity</span>: <span class="number">1</span>;</span><br><span class="line"></span><br><span class="line">  &amp;<span class="selector-class">.loaded</span></span><br><span class="line">    <span class="attribute">opacity</span>: <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">z-index</span>: -<span class="number">1000</span>;</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.sprite</span>, <span class="selector-class">.body</span>, <span class="selector-class">.head</span>, <span class="selector-class">.rainbow</span> <span class="selector-tag">span</span>, <span class="selector-class">.feet</span>, <span class="selector-class">.tail</span> <span class="selector-tag">span</span>, <span class="selector-class">.stars</span> <span class="selector-class">.star</span></span><br><span class="line">    <span class="attribute">position</span>: absolute;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0px</span>,<span class="number">0</span> <span class="number">5px</span>,<span class="number">0</span> <span class="number">10px</span>,<span class="number">0</span> <span class="number">15px</span>,<span class="number">0</span> <span class="number">20px</span>,<span class="number">0</span> <span class="number">25px</span>,<span class="number">0</span> <span class="number">30px</span>,<span class="number">0</span> <span class="number">35px</span>,<span class="number">0</span> <span class="number">40px</span>,<span class="number">0</span> <span class="number">45px</span>,<span class="number">0</span> <span class="number">50px</span>,<span class="number">0</span> <span class="number">55px</span>,<span class="number">0</span> <span class="number">60px</span>,<span class="number">0</span> <span class="number">65px</span>,<span class="number">0</span> <span class="number">70px</span>,<span class="number">0</span> <span class="number">75px</span>,<span class="number">0</span> <span class="number">80px</span>,<span class="number">0</span> <span class="number">85px</span>,<span class="number">0</span> <span class="number">90px</span>,<span class="number">0</span> <span class="number">95px</span>,<span class="number">0</span> <span class="number">100px</span>,<span class="number">0</span> <span class="number">105px</span>,<span class="number">0</span> <span class="number">110px</span>,<span class="number">0</span> <span class="number">115px</span>,<span class="number">0</span> <span class="number">120px</span>,<span class="number">0</span> <span class="number">125px</span>;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">100%</span> <span class="number">5px</span>;</span><br><span class="line">    <span class="attribute">background-repeat</span>: no-repeat;</span><br><span class="line"></span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.nyan-cat</span></span><br><span class="line">    <span class="attribute">position</span>: fixed;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">50%</span>;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">50%</span>;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">165px</span>;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">100px</span>;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">50px</span>;</span><br><span class="line">    <span class="attribute">margin-left</span>: -<span class="number">82px</span>;</span><br><span class="line">    -webkit-<span class="attribute">animation</span>: nyan <span class="number">400ms</span> step-start infinite;</span><br><span class="line">    <span class="attribute">animation</span>: nyan <span class="number">400ms</span> step-start infinite;</span><br><span class="line">    <span class="attribute">z-index</span>: <span class="number">19999</span>;</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.body</span></span><br><span class="line">    <span class="attribute">left</span>: <span class="number">35px</span>;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">105px</span>;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">90px</span>;</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.head</span></span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">80px</span>;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">65px</span>;</span><br><span class="line">    -webkit-<span class="attribute">animation</span>: head <span class="number">400ms</span> linear infinite;</span><br><span class="line">    <span class="attribute">animation</span>: head <span class="number">400ms</span> linear infinite;</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.rainbow</span></span><br><span class="line">    <span class="attribute">position</span>: fixed;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">50%</span>;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">35px</span>;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">50%</span>;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">65px</span>;</span><br><span class="line">    <span class="attribute">overflow</span>: hidden;</span><br><span class="line">    <span class="attribute">z-index</span>: <span class="number">18888</span>;</span><br><span class="line"></span><br><span class="line">    <span class="selector-tag">span</span></span><br><span class="line">      <span class="attribute">display</span>: block;</span><br><span class="line">      <span class="attribute">position</span>: relative;</span><br><span class="line">      <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">      <span class="attribute">width</span>: <span class="number">100%</span>;</span><br><span class="line">      <span class="attribute">height</span>: <span class="number">130px</span>;</span><br><span class="line">      <span class="attribute">background-size</span>: <span class="number">80px</span> <span class="number">5px</span>;</span><br><span class="line">      <span class="attribute">background-repeat</span>: repeat-x;</span><br><span class="line">      -webkit-<span class="attribute">animation</span>: rainbow <span class="number">400ms</span> step-start infinite;</span><br><span class="line">      <span class="attribute">animation</span>: rainbow <span class="number">400ms</span> step-start infinite;</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.feet</span></span><br><span class="line">    <span class="attribute">left</span>: <span class="number">20px</span>;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">75px</span>;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">120px</span>;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">25px</span>;</span><br><span class="line">    -webkit-<span class="attribute">animation</span>: feet <span class="number">400ms</span> infinite;</span><br><span class="line">    <span class="attribute">animation</span>: feet <span class="number">400ms</span> infinite;</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.tail</span></span><br><span class="line">    <span class="attribute">position</span>: relative;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">30px</span>;</span><br><span class="line">    <span class="attribute">overflow</span>: hidden;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">30px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">10px</span>;</span><br><span class="line"></span><br><span class="line">    <span class="selector-tag">span</span></span><br><span class="line">      <span class="attribute">width</span>: <span class="number">25px</span>;</span><br><span class="line">      <span class="attribute">height</span>: <span class="number">120px</span>;</span><br><span class="line">      -webkit-<span class="attribute">animation</span>: tail <span class="number">200ms</span> step-start infinite alternate;</span><br><span class="line">      <span class="attribute">animation</span>: tail <span class="number">200ms</span> step-start infinite alternate;</span><br><span class="line">  </span><br><span class="line">  <span class="selector-class">.sparks-combo</span> </span><br><span class="line">    <span class="attribute">height</span>: <span class="number">300px</span>;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">200%</span>;</span><br><span class="line">    <span class="attribute">position</span>: relative;</span><br><span class="line">    <span class="attribute">animation</span>: woosh <span class="number">700ms</span> <span class="number">0ms</span> linear infinite both;</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.spark</span> </span><br><span class="line">    <span class="attribute">z-index</span>: <span class="number">1</span>;</span><br><span class="line">    <span class="attribute">position</span>: absolute;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">100%</span>;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">100%</span>;</span><br><span class="line">    <span class="attribute">background-color</span>: transparent;</span><br><span class="line">    <span class="attribute">background</span>: <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">6px</span>, transparent <span class="number">6px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">6px</span>, transparent <span class="number">6px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">6px</span>, transparent <span class="number">6px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">6px</span>, transparent <span class="number">6px</span>, transparent <span class="number">400px</span>) repeat-x;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:before</span> </span><br><span class="line">      <span class="attribute">background</span>: <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">5px</span>, transparent <span class="number">5px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">5px</span>, transparent <span class="number">5px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">5px</span>, transparent <span class="number">5px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">5px</span>, transparent <span class="number">5px</span>, transparent <span class="number">400px</span>) repeat-x;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:after</span> </span><br><span class="line">      <span class="attribute">background</span>: <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">6px</span>, transparent <span class="number">6px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">6px</span>, transparent <span class="number">6px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">11px</span>, transparent <span class="number">11px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">11px</span>, transparent <span class="number">11px</span>, transparent <span class="number">400px</span>) repeat-x;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:before</span>,<span class="selector-pseudo">&amp;:after</span> </span><br><span class="line">      <span class="attribute">content</span>: <span class="string">&#x27;&#x27;</span>;</span><br><span class="line">      <span class="attribute">position</span>: absolute;</span><br><span class="line">      <span class="attribute">width</span>: <span class="number">100%</span>;</span><br><span class="line">      <span class="attribute">height</span>: <span class="number">100%</span>;</span><br><span class="line">      <span class="attribute">background-color</span>: transparent;</span><br><span class="line">    </span><br><span class="line">    </span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">1</span>) </span><br><span class="line">      <span class="attribute">z-index</span>: <span class="number">3</span>;</span><br><span class="line">      <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">      <span class="attribute">left</span>: <span class="number">20px</span>;</span><br><span class="line">      <span class="attribute">animation</span>: sparkly <span class="number">700ms</span> <span class="number">0ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">1</span>)<span class="selector-pseudo">:before</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-before <span class="number">700ms</span> <span class="number">0ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">1</span>)<span class="selector-pseudo">:after</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-after <span class="number">700ms</span> <span class="number">0ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">2</span>) </span><br><span class="line">      <span class="attribute">top</span>: <span class="number">40px</span>;</span><br><span class="line">      <span class="attribute">left</span>: <span class="number">170px</span>;</span><br><span class="line">      <span class="attribute">animation</span>: sparkly <span class="number">700ms</span> <span class="number">200ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">2</span>)<span class="selector-pseudo">:before</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-before <span class="number">700ms</span> <span class="number">200ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">2</span>)<span class="selector-pseudo">:after</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-after <span class="number">700ms</span> <span class="number">200ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">3</span>) </span><br><span class="line">      <span class="attribute">top</span>: <span class="number">100px</span>;</span><br><span class="line">      <span class="attribute">left</span>: <span class="number">320px</span>;</span><br><span class="line">      <span class="attribute">animation</span>: sparkly <span class="number">700ms</span> <span class="number">400ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">3</span>)<span class="selector-pseudo">:before</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-before <span class="number">700ms</span> <span class="number">400ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">3</span>)<span class="selector-pseudo">:after</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-after <span class="number">700ms</span> <span class="number">400ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">4</span>) </span><br><span class="line">      <span class="attribute">top</span>: <span class="number">150px</span>;</span><br><span class="line">      <span class="attribute">left</span>: <span class="number">200px</span>;</span><br><span class="line">      <span class="attribute">animation</span>: sparkly <span class="number">700ms</span> <span class="number">600ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">4</span>)<span class="selector-pseudo">:before</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-before <span class="number">700ms</span> <span class="number">600ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">4</span>)<span class="selector-pseudo">:after</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-after <span class="number">700ms</span> <span class="number">600ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.body</span></span><br><span class="line">    <span class="attribute">background-image</span>: <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#000000</span> <span class="number">95px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">100px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">20px</span>, <span class="number">#fe91fe</span> <span class="number">20px</span>, <span class="number">#fe91fe</span> <span class="number">85px</span>, <span class="number">#f9d28f</span> <span class="number">85px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">15px</span>, <span class="number">#fe91fe</span> <span class="number">15px</span>, <span class="number">#fe91fe</span> <span class="number">45px</span>, <span class="number">#f90297</span> <span class="number">45px</span>, <span class="number">#f90297</span> <span class="number">50px</span>, <span class="number">#fe91fe</span> <span class="number">50px</span>, <span class="number">#fe91fe</span> <span class="number">60px</span>, <span class="number">#f90297</span> <span class="number">60px</span>, <span class="number">#f90297</span> <span class="number">65px</span>, <span class="number">#fe91fe</span> <span class="number">65px</span>, <span class="number">#fe91fe</span> <span class="number">90px</span>, <span class="number">#f9d28f</span> <span class="number">90px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">20px</span>, <span class="number">#f90297</span> <span class="number">20px</span>, <span class="number">#f90297</span> <span class="number">25px</span>, <span class="number">#fe91fe</span> <span class="number">25px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">80px</span>, <span class="number">#f90297</span> <span class="number">80px</span>, <span class="number">#f90297</span> <span class="number">85px</span>, <span class="number">#fe91fe</span> <span class="number">85px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">40px</span>, <span class="number">#f90297</span> <span class="number">40px</span>, <span class="number">#f90297</span> <span class="number">45px</span>, <span class="number">#fe91fe</span> <span class="number">45px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">25px</span>, <span class="number">#f90297</span> <span class="number">25px</span>, <span class="number">#f90297</span> <span class="number">30px</span>, <span class="number">#fe91fe</span> <span class="number">30px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">45px</span>, <span class="number">#f90297</span> <span class="number">45px</span>, <span class="number">#f90297</span> <span class="number">50px</span>, <span class="number">#fe91fe</span> <span class="number">50px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">15px</span>, <span class="number">#f90297</span> <span class="number">15px</span>, <span class="number">#f90297</span> <span class="number">20px</span>, <span class="number">#fe91fe</span> <span class="number">20px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">35px</span>, <span class="number">#f90297</span> <span class="number">35px</span>, <span class="number">#f90297</span> <span class="number">40px</span>, <span class="number">#fe91fe</span> <span class="number">40px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">15px</span>, <span class="number">#fe91fe</span> <span class="number">15px</span>, <span class="number">#fe91fe</span> <span class="number">20px</span>, <span class="number">#f90297</span> <span class="number">20px</span>, <span class="number">#f90297</span> <span class="number">25px</span>, <span class="number">#fe91fe</span> <span class="number">25px</span>, <span class="number">#fe91fe</span> <span class="number">90px</span>, <span class="number">#f9d28f</span> <span class="number">90px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">20px</span>, <span class="number">#fe91fe</span> <span class="number">20px</span>, <span class="number">#fe91fe</span> <span class="number">85px</span>, <span class="number">#f9d28f</span> <span class="number">85px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#000000</span> <span class="number">95px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">100px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">105px</span>);</span><br><span class="line">    </span><br><span class="line">  <span class="selector-class">.head</span> </span><br><span class="line">    <span class="attribute">background-image</span>: <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">20px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">60px</span>, <span class="number">#000000</span> <span class="number">60px</span>, <span class="number">#000000</span> <span class="number">70px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">70px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">25px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">25px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">55px</span>, <span class="number">#000000</span> <span class="number">55px</span>, <span class="number">#000000</span> <span class="number">60px</span>, <span class="number">#9d9d9d</span> <span class="number">60px</span>, <span class="number">#9d9d9d</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">30px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">30px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">50px</span>, <span class="number">#000000</span> <span class="number">50px</span>, <span class="number">#000000</span> <span class="number">55px</span>, <span class="number">#9d9d9d</span> <span class="number">55px</span>, <span class="number">#9d9d9d</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">30px</span>, <span class="number">#000000</span> <span class="number">30px</span>, <span class="number">#000000</span> <span class="number">35px</span>, <span class="number">#000000</span> <span class="number">35px</span>, <span class="number">#000000</span> <span class="number">50px</span>, <span class="number">#9d9d9d</span> <span class="number">50px</span>, <span class="number">#9d9d9d</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#ffffff</span> <span class="number">20px</span>, <span class="number">#ffffff</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">55px</span>, <span class="number">#ffffff</span> <span class="number">55px</span>, <span class="number">#ffffff</span> <span class="number">60px</span>, <span class="number">#000000</span> <span class="number">60px</span>, <span class="number">#000000</span> <span class="number">65px</span>, <span class="number">#9d9d9d</span> <span class="number">65px</span>, <span class="number">#9d9d9d</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">45px</span>, <span class="number">#000000</span> <span class="number">45px</span>, <span class="number">#000000</span> <span class="number">50px</span>, <span class="number">#9d9d9d</span> <span class="number">50px</span>, <span class="number">#9d9d9d</span> <span class="number">55px</span>, <span class="number">#000000</span> <span class="number">55px</span>, <span class="number">#000000</span> <span class="number">65px</span>, <span class="number">#9d9d9d</span> <span class="number">65px</span>, <span class="number">#9d9d9d</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#ff9593</span> <span class="number">10px</span>, <span class="number">#ff9593</span> <span class="number">20px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#9d9d9d</span> <span class="number">65px</span>, <span class="number">#ff9593</span> <span class="number">65px</span>, <span class="number">#ff9593</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#ff9593</span> <span class="number">10px</span>, <span class="number">#ff9593</span> <span class="number">20px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#9d9d9d</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">40px</span>, <span class="number">#000000</span> <span class="number">40px</span>, <span class="number">#000000</span> <span class="number">45px</span>, <span class="number">#9d9d9d</span> <span class="number">45px</span>, <span class="number">#9d9d9d</span> <span class="number">55px</span>, <span class="number">#000000</span> <span class="number">55px</span>, <span class="number">#000000</span> <span class="number">60px</span>, <span class="number">#9d9d9d</span> <span class="number">60px</span>, <span class="number">#9d9d9d</span> <span class="number">65px</span>, <span class="number">#ff9593</span> <span class="number">65px</span>, <span class="number">#ff9593</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">60px</span>, <span class="number">#9d9d9d</span> <span class="number">60px</span>, <span class="number">#9d9d9d</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="number">#9d9d9d</span> <span class="number">15px</span>, <span class="number">#9d9d9d</span> <span class="number">65px</span>, <span class="number">#000000</span> <span class="number">65px</span>, <span class="number">#000000</span> <span class="number">70px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">70px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">65px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">65px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>);</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.rainbow</span> &gt; <span class="selector-tag">span</span> </span><br><span class="line">    <span class="attribute">background-image</span>: <span class="built_in">linear-gradient</span>(to right, <span class="number">#fe0000</span> <span class="number">0%</span>, <span class="number">#fe0000</span> <span class="number">50%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">50%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#fe0000</span> <span class="number">0%</span>, <span class="number">#fe0000</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffa500</span> <span class="number">0%</span>, <span class="number">#ffa500</span> <span class="number">50%</span>, <span class="number">#fe0000</span> <span class="number">50%</span>, <span class="number">#fe0000</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffa500</span> <span class="number">0%</span>, <span class="number">#ffa500</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffff00</span> <span class="number">0%</span>, <span class="number">#ffff00</span> <span class="number">50%</span>, <span class="number">#ffa500</span> <span class="number">50%</span>, <span class="number">#ffa500</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffff00</span> <span class="number">0%</span>, <span class="number">#ffff00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#00fb00</span> <span class="number">0%</span>, <span class="number">#00fb00</span> <span class="number">50%</span>, <span class="number">#ffff00</span> <span class="number">50%</span>, <span class="number">#ffff00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#00fb00</span> <span class="number">0%</span>, <span class="number">#00fb00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#009eff</span> <span class="number">0%</span>, <span class="number">#009eff</span> <span class="number">50%</span>, <span class="number">#00fb00</span> <span class="number">50%</span>, <span class="number">#00fb00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#009eff</span> <span class="number">0%</span>, <span class="number">#009eff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#6531ff</span> <span class="number">0%</span>, <span class="number">#6531ff</span> <span class="number">50%</span>, <span class="number">#009eff</span> <span class="number">50%</span>, <span class="number">#009eff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#6531ff</span> <span class="number">0%</span>, <span class="number">#6531ff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">50%</span>, <span class="number">#6531ff</span> <span class="number">50%</span>, <span class="number">#6531ff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">50%</span>, <span class="number">#fe0000</span> <span class="number">50%</span>, <span class="number">#fe0000</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#fe0000</span> <span class="number">0%</span>, <span class="number">#fe0000</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#fe0000</span> <span class="number">0%</span>, <span class="number">#fe0000</span> <span class="number">50%</span>, <span class="number">#ffa500</span> <span class="number">50%</span>, <span class="number">#ffa500</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffa500</span> <span class="number">0%</span>, <span class="number">#ffa500</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffa500</span> <span class="number">0%</span>, <span class="number">#ffa500</span> <span class="number">50%</span>, <span class="number">#ffff00</span> <span class="number">50%</span>, <span class="number">#ffff00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffff00</span> <span class="number">0%</span>, <span class="number">#ffff00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffff00</span> <span class="number">0%</span>, <span class="number">#ffff00</span> <span class="number">50%</span>, <span class="number">#00fb00</span> <span class="number">50%</span>, <span class="number">#00fb00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#00fb00</span> <span class="number">0%</span>, <span class="number">#00fb00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#00fb00</span> <span class="number">0%</span>, <span class="number">#00fb00</span> <span class="number">50%</span>, <span class="number">#009eff</span> <span class="number">50%</span>, <span class="number">#009eff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#009eff</span> <span class="number">0%</span>, <span class="number">#009eff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#009eff</span> <span class="number">0%</span>, <span class="number">#009eff</span> <span class="number">50%</span>, <span class="number">#6531ff</span> <span class="number">50%</span>, <span class="number">#6531ff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#6531ff</span> <span class="number">0%</span>, <span class="number">#6531ff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#6531ff</span> <span class="number">0%</span>, <span class="number">#6531ff</span> <span class="number">50%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">50%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">100%</span>);</span><br><span class="line"></span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.feet</span> </span><br><span class="line">    <span class="attribute">background-image</span>: <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">25px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">25px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">120px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">110px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">110px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">120px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">35px</span>, <span class="number">#9d9d9d</span> <span class="number">35px</span>, <span class="number">#9d9d9d</span> <span class="number">40px</span>, <span class="number">#000000</span> <span class="number">40px</span>, <span class="number">#000000</span> <span class="number">80px</span>, <span class="number">#9d9d9d</span> <span class="number">80px</span>, <span class="number">#9d9d9d</span> <span class="number">110px</span>, <span class="number">#000000</span> <span class="number">110px</span>, <span class="number">#000000</span> <span class="number">115px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">115px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">120px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">20px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">40px</span>, <span class="number">#000000</span> <span class="number">40px</span>, <span class="number">#000000</span> <span class="number">45px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">45px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">80px</span>, <span class="number">#9d9d9d</span> <span class="number">80px</span>, <span class="number">#9d9d9d</span> <span class="number">90px</span>, <span class="number">#000000</span> <span class="number">90px</span>, <span class="number">#000000</span> <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>, <span class="number">#9d9d9d</span> <span class="number">105px</span>, <span class="number">#9d9d9d</span> <span class="number">115px</span>, <span class="number">#000000</span> <span class="number">115px</span>, <span class="number">#000000</span> <span class="number">120px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">15px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">30px</span>, <span class="number">#000000</span> <span class="number">30px</span>, <span class="number">#000000</span> <span class="number">45px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">45px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>, <span class="number">#000000</span> <span class="number">80px</span>, <span class="number">#000000</span> <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">105px</span>, <span class="number">#000000</span> <span class="number">105px</span>, <span class="number">#000000</span> <span class="number">120px</span>);</span><br><span class="line"></span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.tail</span> &gt; <span class="selector-tag">span</span> </span><br><span class="line">    <span class="attribute">background-image</span>: <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">15px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">25px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="number">#9d9d9d</span> <span class="number">15px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">15px</span>);</span><br><span class="line"></span><br><span class="line"><span class="keyword">@-webkit-keyframes</span> rainbow &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">65px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="keyword">@keyframes</span> rainbow &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">65px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@-webkit-keyframes</span> nyan &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">50px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">10%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">50px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">80%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">53px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">50px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> nyan &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">50px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">10%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">50px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">80%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">53px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">50px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@-webkit-keyframes</span> feet &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">20px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">30px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> feet &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">20px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">30px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@-webkit-keyframes</span> head &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">24.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">25%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">88px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">49.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">88px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">74.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">75%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">82px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">99.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">82px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> head &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">24.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">25%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">88px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">49.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">88px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">74.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">75%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">82px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">99.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">82px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@-webkit-keyframes</span> tail &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">25%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">49.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">30px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">74.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">30px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">75%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">60px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">99.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">60px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">90px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> tail &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">25%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">49.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">30px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">74.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">30px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">75%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">60px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">99.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">60px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">90px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> woosh &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">0px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">left</span>: -<span class="number">400px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> sparkly &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">6px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">17px</span> <span class="number">17px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">16%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">17px</span> <span class="number">0</span>, <span class="number">34px</span> <span class="number">17px</span>, <span class="number">17px</span> <span class="number">34px</span>, <span class="number">0</span> <span class="number">17px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">33%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">17px</span> <span class="number">0</span>, <span class="number">34px</span> <span class="number">17px</span>, <span class="number">17px</span> <span class="number">34px</span>, <span class="number">0</span> <span class="number">17px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">6px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">17px</span> <span class="number">17px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">66%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">11px</span>, <span class="number">400px</span> <span class="number">11px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">17px</span> <span class="number">6px</span>, <span class="number">17px</span> <span class="number">23px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">83%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">400px</span> <span class="number">5px</span>, <span class="number">400px</span> <span class="number">5px</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">11px</span> <span class="number">17px</span>, <span class="number">22px</span> <span class="number">17px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">6px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">17px</span> <span class="number">17px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> sparkly-before &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">16%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">33%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">5px</span>, <span class="number">400px</span> <span class="number">5px</span>, <span class="number">400px</span> <span class="number">5px</span>, <span class="number">400px</span> <span class="number">5px</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">6px</span> <span class="number">6px</span>, <span class="number">29px</span> <span class="number">6px</span>, <span class="number">29px</span> <span class="number">29px</span>, <span class="number">6px</span> <span class="number">29px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">66%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">83%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">400px</span> <span class="number">5px</span>, <span class="number">400px</span> <span class="number">5px</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">17px</span> <span class="number">12px</span>, <span class="number">17px</span> <span class="number">22px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> sparkly-after &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">16%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">33%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">11px</span>, <span class="number">400px</span> <span class="number">11px</span>, <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">17px</span> <span class="number">0</span>, <span class="number">17px</span> <span class="number">29px</span>, <span class="number">0</span> <span class="number">17px</span>, <span class="number">29px</span> <span class="number">17px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">66%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">6px</span> <span class="number">17px</span>, <span class="number">23px</span> <span class="number">17px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">83%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
+最后修改<code>_config.butterfly.yml</code>中<code>preloader</code>选项, 改完以后<code>source: 1</code>为满屏加载无pace胶囊,<code>source: 2</code>为pace胶囊无满屏动画, <code>source: 3</code>是两者都启用。<psw>（这边懒得说就搬运的鱼佬那加载动画的教程了。。。。。反正都一样。。。。。）</psw><figure class="highlight yml"><table><tr><td class="code"><pre><span class="line"><span class="comment"># Loading Animation (加载动画)</span></span><br><span class="line"><span class="attr">preloader:</span></span><br><span class="line">  <span class="attr">enable:</span> <span class="literal">true</span></span><br><span class="line">  <span class="comment"># source</span></span><br><span class="line">  <span class="comment"># 1. fullpage-loading</span></span><br><span class="line">  <span class="comment"># 2. pace (progress bar)</span></span><br><span class="line">  <span class="comment"># else all</span></span><br><span class="line">  <span class="attr">source:</span> <span class="number">3</span></span><br><span class="line">  <span class="comment"># pace theme (see https://codebyzach.github.io/pace/)</span></span><br><span class="line">  <span class="attr">pace_css_url:</span> <span class="string">/css/progress_bar.css</span></span><br><span class="line">  <span class="attr">avatar:</span> <span class="comment"># 自定义头像</span></span><br></pre></td></tr></table></figure>
+</li>
+</ol>
+<h3 id="butterfly-4-4-2-以下版本方案"><a href="#butterfly-4-4-2-以下版本方案" class="headerlink" title="butterfly 4.4.2 以下版本方案"></a>butterfly 4.4.2 以下版本方案</h3><ol>
+<li><p>修改<code>[Blogroot]\themes\butterfly\source\css\_layout\loading.styl</code>，复制以下代码替换全部内容。</p>
+<figure class="highlight stylus"><table><tr><td class="code"><pre><span class="line"><span class="selector-id">#loading-box</span></span><br><span class="line">  <span class="attribute">width</span>: <span class="number">100%</span>;</span><br><span class="line">  <span class="attribute">height</span>: <span class="number">100%</span>;</span><br><span class="line">  <span class="attribute">margin</span>: <span class="number">0</span>;</span><br><span class="line">  <span class="attribute">padding</span>: <span class="number">0</span>;</span><br><span class="line">  <span class="attribute">background</span>: <span class="number">#036</span>;</span><br><span class="line">  <span class="attribute">overflow</span>: hidden;</span><br><span class="line">  <span class="attribute">position</span> : fixed;</span><br><span class="line">  <span class="attribute">font</span>: <span class="number">13px</span>/<span class="number">1.4</span> Helvetica, arial, freesans, clean, sans-serif, <span class="string">&quot;Segoe UI Emoji&quot;</span>, <span class="string">&quot;Segoe UI Symbol&quot;</span>;</span><br><span class="line">  <span class="attribute">z-index</span>: <span class="number">9999</span>;</span><br><span class="line">  <span class="attribute">opacity</span>: <span class="number">1</span>;</span><br><span class="line"></span><br><span class="line">  &amp;<span class="selector-class">.loaded</span></span><br><span class="line">    <span class="attribute">opacity</span>: <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">z-index</span>: -<span class="number">1000</span>;</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.sprite</span>, <span class="selector-class">.body</span>, <span class="selector-class">.head</span>, <span class="selector-class">.rainbow</span> <span class="selector-tag">span</span>, <span class="selector-class">.feet</span>, <span class="selector-class">.tail</span> <span class="selector-tag">span</span>, <span class="selector-class">.stars</span> <span class="selector-class">.star</span></span><br><span class="line">    <span class="attribute">position</span>: absolute;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0px</span>,<span class="number">0</span> <span class="number">5px</span>,<span class="number">0</span> <span class="number">10px</span>,<span class="number">0</span> <span class="number">15px</span>,<span class="number">0</span> <span class="number">20px</span>,<span class="number">0</span> <span class="number">25px</span>,<span class="number">0</span> <span class="number">30px</span>,<span class="number">0</span> <span class="number">35px</span>,<span class="number">0</span> <span class="number">40px</span>,<span class="number">0</span> <span class="number">45px</span>,<span class="number">0</span> <span class="number">50px</span>,<span class="number">0</span> <span class="number">55px</span>,<span class="number">0</span> <span class="number">60px</span>,<span class="number">0</span> <span class="number">65px</span>,<span class="number">0</span> <span class="number">70px</span>,<span class="number">0</span> <span class="number">75px</span>,<span class="number">0</span> <span class="number">80px</span>,<span class="number">0</span> <span class="number">85px</span>,<span class="number">0</span> <span class="number">90px</span>,<span class="number">0</span> <span class="number">95px</span>,<span class="number">0</span> <span class="number">100px</span>,<span class="number">0</span> <span class="number">105px</span>,<span class="number">0</span> <span class="number">110px</span>,<span class="number">0</span> <span class="number">115px</span>,<span class="number">0</span> <span class="number">120px</span>,<span class="number">0</span> <span class="number">125px</span>;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">100%</span> <span class="number">5px</span>;</span><br><span class="line">    <span class="attribute">background-repeat</span>: no-repeat;</span><br><span class="line"></span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.nyan-cat</span></span><br><span class="line">    <span class="attribute">position</span>: fixed;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">50%</span>;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">50%</span>;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">165px</span>;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">100px</span>;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">50px</span>;</span><br><span class="line">    <span class="attribute">margin-left</span>: -<span class="number">82px</span>;</span><br><span class="line">    -webkit-<span class="attribute">animation</span>: nyan <span class="number">400ms</span> step-start infinite;</span><br><span class="line">    <span class="attribute">animation</span>: nyan <span class="number">400ms</span> step-start infinite;</span><br><span class="line">    <span class="attribute">z-index</span>: <span class="number">19999</span>;</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.body</span></span><br><span class="line">    <span class="attribute">left</span>: <span class="number">35px</span>;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">105px</span>;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">90px</span>;</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.head</span></span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">80px</span>;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">65px</span>;</span><br><span class="line">    -webkit-<span class="attribute">animation</span>: head <span class="number">400ms</span> linear infinite;</span><br><span class="line">    <span class="attribute">animation</span>: head <span class="number">400ms</span> linear infinite;</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.rainbow</span></span><br><span class="line">    <span class="attribute">position</span>: fixed;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">50%</span>;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">35px</span>;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">50%</span>;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">65px</span>;</span><br><span class="line">    <span class="attribute">overflow</span>: hidden;</span><br><span class="line">    <span class="attribute">z-index</span>: <span class="number">18888</span>;</span><br><span class="line"></span><br><span class="line">    <span class="selector-tag">span</span></span><br><span class="line">      <span class="attribute">display</span>: block;</span><br><span class="line">      <span class="attribute">position</span>: relative;</span><br><span class="line">      <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">      <span class="attribute">width</span>: <span class="number">100%</span>;</span><br><span class="line">      <span class="attribute">height</span>: <span class="number">130px</span>;</span><br><span class="line">      <span class="attribute">background-size</span>: <span class="number">80px</span> <span class="number">5px</span>;</span><br><span class="line">      <span class="attribute">background-repeat</span>: repeat-x;</span><br><span class="line">      -webkit-<span class="attribute">animation</span>: rainbow <span class="number">400ms</span> step-start infinite;</span><br><span class="line">      <span class="attribute">animation</span>: rainbow <span class="number">400ms</span> step-start infinite;</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.feet</span></span><br><span class="line">    <span class="attribute">left</span>: <span class="number">20px</span>;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">75px</span>;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">120px</span>;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">25px</span>;</span><br><span class="line">    -webkit-<span class="attribute">animation</span>: feet <span class="number">400ms</span> infinite;</span><br><span class="line">    <span class="attribute">animation</span>: feet <span class="number">400ms</span> infinite;</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.tail</span></span><br><span class="line">    <span class="attribute">position</span>: relative;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">30px</span>;</span><br><span class="line">    <span class="attribute">overflow</span>: hidden;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">30px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">10px</span>;</span><br><span class="line"></span><br><span class="line">    <span class="selector-tag">span</span></span><br><span class="line">      <span class="attribute">width</span>: <span class="number">25px</span>;</span><br><span class="line">      <span class="attribute">height</span>: <span class="number">120px</span>;</span><br><span class="line">      -webkit-<span class="attribute">animation</span>: tail <span class="number">200ms</span> step-start infinite alternate;</span><br><span class="line">      <span class="attribute">animation</span>: tail <span class="number">200ms</span> step-start infinite alternate;</span><br><span class="line">  </span><br><span class="line">  <span class="selector-class">.sparks-combo</span> </span><br><span class="line">    <span class="attribute">height</span>: <span class="number">300px</span>;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">200%</span>;</span><br><span class="line">    <span class="attribute">position</span>: relative;</span><br><span class="line">    <span class="attribute">animation</span>: woosh <span class="number">700ms</span> <span class="number">0ms</span> linear infinite both;</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.spark</span> </span><br><span class="line">    <span class="attribute">z-index</span>: <span class="number">1</span>;</span><br><span class="line">    <span class="attribute">position</span>: absolute;</span><br><span class="line">    <span class="attribute">width</span>: <span class="number">100%</span>;</span><br><span class="line">    <span class="attribute">height</span>: <span class="number">100%</span>;</span><br><span class="line">    <span class="attribute">background-color</span>: transparent;</span><br><span class="line">    <span class="attribute">background</span>: <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">6px</span>, transparent <span class="number">6px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">6px</span>, transparent <span class="number">6px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">6px</span>, transparent <span class="number">6px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">6px</span>, transparent <span class="number">6px</span>, transparent <span class="number">400px</span>) repeat-x;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:before</span> </span><br><span class="line">      <span class="attribute">background</span>: <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">5px</span>, transparent <span class="number">5px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">5px</span>, transparent <span class="number">5px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">5px</span>, transparent <span class="number">5px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">5px</span>, transparent <span class="number">5px</span>, transparent <span class="number">400px</span>) repeat-x;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:after</span> </span><br><span class="line">      <span class="attribute">background</span>: <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">6px</span>, transparent <span class="number">6px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">6px</span>, transparent <span class="number">6px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">11px</span>, transparent <span class="number">11px</span>, transparent <span class="number">400px</span>) repeat-x, <span class="built_in">linear-gradient</span>(to right, white <span class="number">0px</span>, white <span class="number">11px</span>, transparent <span class="number">11px</span>, transparent <span class="number">400px</span>) repeat-x;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:before</span>,<span class="selector-pseudo">&amp;:after</span> </span><br><span class="line">      <span class="attribute">content</span>: <span class="string">&#x27;&#x27;</span>;</span><br><span class="line">      <span class="attribute">position</span>: absolute;</span><br><span class="line">      <span class="attribute">width</span>: <span class="number">100%</span>;</span><br><span class="line">      <span class="attribute">height</span>: <span class="number">100%</span>;</span><br><span class="line">      <span class="attribute">background-color</span>: transparent;</span><br><span class="line">    </span><br><span class="line">    </span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">1</span>) </span><br><span class="line">      <span class="attribute">z-index</span>: <span class="number">3</span>;</span><br><span class="line">      <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">      <span class="attribute">left</span>: <span class="number">20px</span>;</span><br><span class="line">      <span class="attribute">animation</span>: sparkly <span class="number">700ms</span> <span class="number">0ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">1</span>)<span class="selector-pseudo">:before</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-before <span class="number">700ms</span> <span class="number">0ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">1</span>)<span class="selector-pseudo">:after</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-after <span class="number">700ms</span> <span class="number">0ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">2</span>) </span><br><span class="line">      <span class="attribute">top</span>: <span class="number">40px</span>;</span><br><span class="line">      <span class="attribute">left</span>: <span class="number">170px</span>;</span><br><span class="line">      <span class="attribute">animation</span>: sparkly <span class="number">700ms</span> <span class="number">200ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">2</span>)<span class="selector-pseudo">:before</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-before <span class="number">700ms</span> <span class="number">200ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">2</span>)<span class="selector-pseudo">:after</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-after <span class="number">700ms</span> <span class="number">200ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">3</span>) </span><br><span class="line">      <span class="attribute">top</span>: <span class="number">100px</span>;</span><br><span class="line">      <span class="attribute">left</span>: <span class="number">320px</span>;</span><br><span class="line">      <span class="attribute">animation</span>: sparkly <span class="number">700ms</span> <span class="number">400ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">3</span>)<span class="selector-pseudo">:before</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-before <span class="number">700ms</span> <span class="number">400ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">3</span>)<span class="selector-pseudo">:after</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-after <span class="number">700ms</span> <span class="number">400ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">4</span>) </span><br><span class="line">      <span class="attribute">top</span>: <span class="number">150px</span>;</span><br><span class="line">      <span class="attribute">left</span>: <span class="number">200px</span>;</span><br><span class="line">      <span class="attribute">animation</span>: sparkly <span class="number">700ms</span> <span class="number">600ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">4</span>)<span class="selector-pseudo">:before</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-before <span class="number">700ms</span> <span class="number">600ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line">    <span class="selector-pseudo">&amp;:nth-child</span>(<span class="number">4</span>)<span class="selector-pseudo">:after</span> </span><br><span class="line">      <span class="attribute">animation</span>: sparkly-after <span class="number">700ms</span> <span class="number">600ms</span> <span class="built_in">steps</span>(<span class="number">1</span>) infinite both;</span><br><span class="line"></span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.body</span></span><br><span class="line">    <span class="attribute">background-image</span>: <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#000000</span> <span class="number">95px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">100px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">20px</span>, <span class="number">#fe91fe</span> <span class="number">20px</span>, <span class="number">#fe91fe</span> <span class="number">85px</span>, <span class="number">#f9d28f</span> <span class="number">85px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">15px</span>, <span class="number">#fe91fe</span> <span class="number">15px</span>, <span class="number">#fe91fe</span> <span class="number">45px</span>, <span class="number">#f90297</span> <span class="number">45px</span>, <span class="number">#f90297</span> <span class="number">50px</span>, <span class="number">#fe91fe</span> <span class="number">50px</span>, <span class="number">#fe91fe</span> <span class="number">60px</span>, <span class="number">#f90297</span> <span class="number">60px</span>, <span class="number">#f90297</span> <span class="number">65px</span>, <span class="number">#fe91fe</span> <span class="number">65px</span>, <span class="number">#fe91fe</span> <span class="number">90px</span>, <span class="number">#f9d28f</span> <span class="number">90px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">20px</span>, <span class="number">#f90297</span> <span class="number">20px</span>, <span class="number">#f90297</span> <span class="number">25px</span>, <span class="number">#fe91fe</span> <span class="number">25px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">80px</span>, <span class="number">#f90297</span> <span class="number">80px</span>, <span class="number">#f90297</span> <span class="number">85px</span>, <span class="number">#fe91fe</span> <span class="number">85px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">40px</span>, <span class="number">#f90297</span> <span class="number">40px</span>, <span class="number">#f90297</span> <span class="number">45px</span>, <span class="number">#fe91fe</span> <span class="number">45px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">25px</span>, <span class="number">#f90297</span> <span class="number">25px</span>, <span class="number">#f90297</span> <span class="number">30px</span>, <span class="number">#fe91fe</span> <span class="number">30px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">45px</span>, <span class="number">#f90297</span> <span class="number">45px</span>, <span class="number">#f90297</span> <span class="number">50px</span>, <span class="number">#fe91fe</span> <span class="number">50px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">15px</span>, <span class="number">#f90297</span> <span class="number">15px</span>, <span class="number">#f90297</span> <span class="number">20px</span>, <span class="number">#fe91fe</span> <span class="number">20px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">10px</span>, <span class="number">#fe91fe</span> <span class="number">35px</span>, <span class="number">#f90297</span> <span class="number">35px</span>, <span class="number">#f90297</span> <span class="number">40px</span>, <span class="number">#fe91fe</span> <span class="number">40px</span>, <span class="number">#fe91fe</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">15px</span>, <span class="number">#fe91fe</span> <span class="number">15px</span>, <span class="number">#fe91fe</span> <span class="number">20px</span>, <span class="number">#f90297</span> <span class="number">20px</span>, <span class="number">#f90297</span> <span class="number">25px</span>, <span class="number">#fe91fe</span> <span class="number">25px</span>, <span class="number">#fe91fe</span> <span class="number">90px</span>, <span class="number">#f9d28f</span> <span class="number">90px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">5px</span>, <span class="number">#f9d28f</span> <span class="number">20px</span>, <span class="number">#fe91fe</span> <span class="number">20px</span>, <span class="number">#fe91fe</span> <span class="number">85px</span>, <span class="number">#f9d28f</span> <span class="number">85px</span>, <span class="number">#f9d28f</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#f9d28f</span> <span class="number">10px</span>, <span class="number">#f9d28f</span> <span class="number">95px</span>, <span class="number">#000000</span> <span class="number">95px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">100px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">105px</span>);</span><br><span class="line">    </span><br><span class="line">  <span class="selector-class">.head</span> </span><br><span class="line">    <span class="attribute">background-image</span>: <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">20px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">60px</span>, <span class="number">#000000</span> <span class="number">60px</span>, <span class="number">#000000</span> <span class="number">70px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">70px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">105px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">25px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">25px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">55px</span>, <span class="number">#000000</span> <span class="number">55px</span>, <span class="number">#000000</span> <span class="number">60px</span>, <span class="number">#9d9d9d</span> <span class="number">60px</span>, <span class="number">#9d9d9d</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">30px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">30px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">50px</span>, <span class="number">#000000</span> <span class="number">50px</span>, <span class="number">#000000</span> <span class="number">55px</span>, <span class="number">#9d9d9d</span> <span class="number">55px</span>, <span class="number">#9d9d9d</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">30px</span>, <span class="number">#000000</span> <span class="number">30px</span>, <span class="number">#000000</span> <span class="number">35px</span>, <span class="number">#000000</span> <span class="number">35px</span>, <span class="number">#000000</span> <span class="number">50px</span>, <span class="number">#9d9d9d</span> <span class="number">50px</span>, <span class="number">#9d9d9d</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#ffffff</span> <span class="number">20px</span>, <span class="number">#ffffff</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">55px</span>, <span class="number">#ffffff</span> <span class="number">55px</span>, <span class="number">#ffffff</span> <span class="number">60px</span>, <span class="number">#000000</span> <span class="number">60px</span>, <span class="number">#000000</span> <span class="number">65px</span>, <span class="number">#9d9d9d</span> <span class="number">65px</span>, <span class="number">#9d9d9d</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">45px</span>, <span class="number">#000000</span> <span class="number">45px</span>, <span class="number">#000000</span> <span class="number">50px</span>, <span class="number">#9d9d9d</span> <span class="number">50px</span>, <span class="number">#9d9d9d</span> <span class="number">55px</span>, <span class="number">#000000</span> <span class="number">55px</span>, <span class="number">#000000</span> <span class="number">65px</span>, <span class="number">#9d9d9d</span> <span class="number">65px</span>, <span class="number">#9d9d9d</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#ff9593</span> <span class="number">10px</span>, <span class="number">#ff9593</span> <span class="number">20px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#9d9d9d</span> <span class="number">65px</span>, <span class="number">#ff9593</span> <span class="number">65px</span>, <span class="number">#ff9593</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#ff9593</span> <span class="number">10px</span>, <span class="number">#ff9593</span> <span class="number">20px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#9d9d9d</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">40px</span>, <span class="number">#000000</span> <span class="number">40px</span>, <span class="number">#000000</span> <span class="number">45px</span>, <span class="number">#9d9d9d</span> <span class="number">45px</span>, <span class="number">#9d9d9d</span> <span class="number">55px</span>, <span class="number">#000000</span> <span class="number">55px</span>, <span class="number">#000000</span> <span class="number">60px</span>, <span class="number">#9d9d9d</span> <span class="number">60px</span>, <span class="number">#9d9d9d</span> <span class="number">65px</span>, <span class="number">#ff9593</span> <span class="number">65px</span>, <span class="number">#ff9593</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">60px</span>, <span class="number">#9d9d9d</span> <span class="number">60px</span>, <span class="number">#9d9d9d</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">70px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">75px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="number">#9d9d9d</span> <span class="number">15px</span>, <span class="number">#9d9d9d</span> <span class="number">65px</span>, <span class="number">#000000</span> <span class="number">65px</span>, <span class="number">#000000</span> <span class="number">70px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">70px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">65px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">65px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>);</span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.rainbow</span> &gt; <span class="selector-tag">span</span> </span><br><span class="line">    <span class="attribute">background-image</span>: <span class="built_in">linear-gradient</span>(to right, <span class="number">#fe0000</span> <span class="number">0%</span>, <span class="number">#fe0000</span> <span class="number">50%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">50%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#fe0000</span> <span class="number">0%</span>, <span class="number">#fe0000</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffa500</span> <span class="number">0%</span>, <span class="number">#ffa500</span> <span class="number">50%</span>, <span class="number">#fe0000</span> <span class="number">50%</span>, <span class="number">#fe0000</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffa500</span> <span class="number">0%</span>, <span class="number">#ffa500</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffff00</span> <span class="number">0%</span>, <span class="number">#ffff00</span> <span class="number">50%</span>, <span class="number">#ffa500</span> <span class="number">50%</span>, <span class="number">#ffa500</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffff00</span> <span class="number">0%</span>, <span class="number">#ffff00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#00fb00</span> <span class="number">0%</span>, <span class="number">#00fb00</span> <span class="number">50%</span>, <span class="number">#ffff00</span> <span class="number">50%</span>, <span class="number">#ffff00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#00fb00</span> <span class="number">0%</span>, <span class="number">#00fb00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#009eff</span> <span class="number">0%</span>, <span class="number">#009eff</span> <span class="number">50%</span>, <span class="number">#00fb00</span> <span class="number">50%</span>, <span class="number">#00fb00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#009eff</span> <span class="number">0%</span>, <span class="number">#009eff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#6531ff</span> <span class="number">0%</span>, <span class="number">#6531ff</span> <span class="number">50%</span>, <span class="number">#009eff</span> <span class="number">50%</span>, <span class="number">#009eff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#6531ff</span> <span class="number">0%</span>, <span class="number">#6531ff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">50%</span>, <span class="number">#6531ff</span> <span class="number">50%</span>, <span class="number">#6531ff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">50%</span>, <span class="number">#fe0000</span> <span class="number">50%</span>, <span class="number">#fe0000</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#fe0000</span> <span class="number">0%</span>, <span class="number">#fe0000</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#fe0000</span> <span class="number">0%</span>, <span class="number">#fe0000</span> <span class="number">50%</span>, <span class="number">#ffa500</span> <span class="number">50%</span>, <span class="number">#ffa500</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffa500</span> <span class="number">0%</span>, <span class="number">#ffa500</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffa500</span> <span class="number">0%</span>, <span class="number">#ffa500</span> <span class="number">50%</span>, <span class="number">#ffff00</span> <span class="number">50%</span>, <span class="number">#ffff00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffff00</span> <span class="number">0%</span>, <span class="number">#ffff00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#ffff00</span> <span class="number">0%</span>, <span class="number">#ffff00</span> <span class="number">50%</span>, <span class="number">#00fb00</span> <span class="number">50%</span>, <span class="number">#00fb00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#00fb00</span> <span class="number">0%</span>, <span class="number">#00fb00</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#00fb00</span> <span class="number">0%</span>, <span class="number">#00fb00</span> <span class="number">50%</span>, <span class="number">#009eff</span> <span class="number">50%</span>, <span class="number">#009eff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#009eff</span> <span class="number">0%</span>, <span class="number">#009eff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#009eff</span> <span class="number">0%</span>, <span class="number">#009eff</span> <span class="number">50%</span>, <span class="number">#6531ff</span> <span class="number">50%</span>, <span class="number">#6531ff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#6531ff</span> <span class="number">0%</span>, <span class="number">#6531ff</span> <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#6531ff</span> <span class="number">0%</span>, <span class="number">#6531ff</span> <span class="number">50%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">50%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">100%</span>);</span><br><span class="line"></span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.feet</span> </span><br><span class="line">    <span class="attribute">background-image</span>: <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">25px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">25px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">120px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">110px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">110px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">120px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">35px</span>, <span class="number">#9d9d9d</span> <span class="number">35px</span>, <span class="number">#9d9d9d</span> <span class="number">40px</span>, <span class="number">#000000</span> <span class="number">40px</span>, <span class="number">#000000</span> <span class="number">80px</span>, <span class="number">#9d9d9d</span> <span class="number">80px</span>, <span class="number">#9d9d9d</span> <span class="number">110px</span>, <span class="number">#000000</span> <span class="number">110px</span>, <span class="number">#000000</span> <span class="number">115px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">115px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">120px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">20px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">25px</span>, <span class="number">#000000</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">30px</span>, <span class="number">#9d9d9d</span> <span class="number">40px</span>, <span class="number">#000000</span> <span class="number">40px</span>, <span class="number">#000000</span> <span class="number">45px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">45px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">75px</span>, <span class="number">#000000</span> <span class="number">80px</span>, <span class="number">#9d9d9d</span> <span class="number">80px</span>, <span class="number">#9d9d9d</span> <span class="number">90px</span>, <span class="number">#000000</span> <span class="number">90px</span>, <span class="number">#000000</span> <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">100px</span>, <span class="number">#000000</span> <span class="number">105px</span>, <span class="number">#9d9d9d</span> <span class="number">105px</span>, <span class="number">#9d9d9d</span> <span class="number">115px</span>, <span class="number">#000000</span> <span class="number">115px</span>, <span class="number">#000000</span> <span class="number">120px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">15px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">30px</span>, <span class="number">#000000</span> <span class="number">30px</span>, <span class="number">#000000</span> <span class="number">45px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">45px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">80px</span>, <span class="number">#000000</span> <span class="number">80px</span>, <span class="number">#000000</span> <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">95px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">105px</span>, <span class="number">#000000</span> <span class="number">105px</span>, <span class="number">#000000</span> <span class="number">120px</span>);</span><br><span class="line"></span><br><span class="line"></span><br><span class="line">  <span class="selector-class">.tail</span> &gt; <span class="selector-tag">span</span> </span><br><span class="line">    <span class="attribute">background-image</span>: <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">15px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">25px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">100%</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">20px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="number">#9d9d9d</span> <span class="number">15px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">10px</span>, <span class="number">#9d9d9d</span> <span class="number">20px</span>, <span class="number">#000000</span> <span class="number">20px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="number">#000000</span> <span class="number">0%</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">5px</span>, <span class="number">#9d9d9d</span> <span class="number">15px</span>, <span class="number">#000000</span> <span class="number">15px</span>), <span class="built_in">linear-gradient</span>(to right, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">0%</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">5px</span>, <span class="number">#000000</span> <span class="number">15px</span>, <span class="built_in">rgba</span>(<span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>) <span class="number">15px</span>);</span><br><span class="line"></span><br><span class="line"><span class="keyword">@-webkit-keyframes</span> rainbow &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">65px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="keyword">@keyframes</span> rainbow &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">65px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@-webkit-keyframes</span> nyan &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">50px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">10%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">50px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">80%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">53px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">50px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> nyan &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">50px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">10%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">50px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">80%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">53px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">margin-top</span>: -<span class="number">50px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@-webkit-keyframes</span> feet &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">20px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">30px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> feet &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">20px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">30px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@-webkit-keyframes</span> head &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">24.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">25%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">88px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">49.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">88px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">74.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">75%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">82px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">99.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">82px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> head &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">24.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">25%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">88px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">49.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">88px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">74.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">75%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">82px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">99.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">22px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">82px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">25px</span>;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">85px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@-webkit-keyframes</span> tail &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">25%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">49.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">30px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">74.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">30px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">75%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">60px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">99.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">60px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">90px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> tail &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">25%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">49.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">30px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">74.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">30px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">75%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">60px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">99.99%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">60px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">top</span>: -<span class="number">90px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> woosh &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">left</span>: <span class="number">0px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">left</span>: -<span class="number">400px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> sparkly &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">6px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">17px</span> <span class="number">17px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">16%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">17px</span> <span class="number">0</span>, <span class="number">34px</span> <span class="number">17px</span>, <span class="number">17px</span> <span class="number">34px</span>, <span class="number">0</span> <span class="number">17px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">33%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">17px</span> <span class="number">0</span>, <span class="number">34px</span> <span class="number">17px</span>, <span class="number">17px</span> <span class="number">34px</span>, <span class="number">0</span> <span class="number">17px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">6px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">17px</span> <span class="number">17px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">66%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">11px</span>, <span class="number">400px</span> <span class="number">11px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">17px</span> <span class="number">6px</span>, <span class="number">17px</span> <span class="number">23px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">83%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">400px</span> <span class="number">5px</span>, <span class="number">400px</span> <span class="number">5px</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">11px</span> <span class="number">17px</span>, <span class="number">22px</span> <span class="number">17px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">6px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">17px</span> <span class="number">17px</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> sparkly-before &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">16%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">33%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">5px</span>, <span class="number">400px</span> <span class="number">5px</span>, <span class="number">400px</span> <span class="number">5px</span>, <span class="number">400px</span> <span class="number">5px</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">6px</span> <span class="number">6px</span>, <span class="number">29px</span> <span class="number">6px</span>, <span class="number">29px</span> <span class="number">29px</span>, <span class="number">6px</span> <span class="number">29px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">66%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">83%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">400px</span> <span class="number">5px</span>, <span class="number">400px</span> <span class="number">5px</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">17px</span> <span class="number">12px</span>, <span class="number">17px</span> <span class="number">22px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">@keyframes</span> sparkly-after &#123;</span><br><span class="line">  <span class="number">0%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">16%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">33%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">50%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">400px</span> <span class="number">11px</span>, <span class="number">400px</span> <span class="number">11px</span>, <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">17px</span> <span class="number">0</span>, <span class="number">17px</span> <span class="number">29px</span>, <span class="number">0</span> <span class="number">17px</span>, <span class="number">29px</span> <span class="number">17px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">66%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">400px</span> <span class="number">6px</span>, <span class="number">400px</span> <span class="number">6px</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">6px</span> <span class="number">17px</span>, <span class="number">23px</span> <span class="number">17px</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">83%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">  <span class="number">100%</span> &#123;</span><br><span class="line">    <span class="attribute">background-size</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">    <span class="attribute">background-position</span>: <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>, <span class="number">0</span> <span class="number">0</span>;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
+</li>
+<li><p>修改<code>[Blogroot]\themes\butterfly\layout\includes\loading\fullpage-loading.pug</code>，复制以下代码替换全部内容。</p>
+</li>
+</ol>
+<figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line">#loading-box(onclick=&#x27;document.getElementById(&quot;loading-box&quot;).classList.add(&quot;loaded&quot;)&#x27;)</span><br><span class="line">    .sparks-combo</span><br><span class="line">        .spark</span><br><span class="line">        .spark</span><br><span class="line">        .spark</span><br><span class="line">        .spark</span><br><span class="line">    .rainbow</span><br><span class="line">        span</span><br><span class="line">    .nyan-cat</span><br><span class="line">        .feet</span><br><span class="line">        .tail</span><br><span class="line">            span</span><br><span class="line">        .body</span><br><span class="line">        .head</span><br><span class="line">    script(src=&quot;/js/nyan.js&quot;)</span><br></pre></td></tr></table></figure>
+]]></content>
+      <categories>
+        <category>站点折腾</category>
+      </categories>
+      <tags>
+        <tag>站点折腾</tag>
+        <tag>加载动画</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>给你的站点添加个可可爱爱的看板娘——伪春菜</title>
+    <url>/posts/54787/</url>
+    <content><![CDATA[<h1 id="前言"><a href="#前言" class="headerlink" title="前言"></a>前言</h1><p>什么是伪春菜？<a href="https://mzh.moegirl.org.cn/%E4%BC%AA%E6%98%A5%E8%8F%9C">请看这里</a><br>作为一个早在xp时代就出现的桌面精灵，伪春菜有了爆火的人气<br>后来不知道什么时候开始在国内由盛转衰，直到现在我对这个圈子少之又少<br>我自己也下载了ssp并且应用了后来某位大佬复活的Taromati2人格</p>
+<p>某次我逛逛某个博客站点时发现有个站点将伪春菜当成了看板娘<br>就去去搜了一下，得到的结果是：<a href="http://www.lmyoaoa.com/inn/archives/4504/">http://www.lmyoaoa.com/inn/archives/4504/</a><br>又因为这玩意已经很久没更新，所以我将这个的js、css和图片提取出来，然后魔改了一下，方便放在hexo里面<br>废话不多说，开始吧！</p>
+<h1 id="引入js和css"><a href="#引入js和css" class="headerlink" title="引入js和css"></a>引入js和css</h1><p>{blogroot}/source/weichuncai/css/style.css<br><figure class="highlight css"><table><tr><td class="code"><pre><span class="line"><span class="selector-id">#smchuncai</span> &#123;<span class="attribute">opacity</span>:<span class="number">0.85</span>;<span class="attribute">width</span>:<span class="number">160px</span>;<span class="attribute">height</span>:<span class="number">160px</span>;<span class="attribute">position</span>:fixed;<span class="attribute">top</span>:<span class="number">400px</span>;<span class="attribute">left</span>:<span class="number">800px</span>;<span class="attribute">font-size</span>:<span class="number">12px</span>;&#125;</span><br><span class="line">* <span class="selector-tag">html</span> <span class="selector-id">#smchuncai</span> &#123;<span class="attribute">position</span>:absolute;&#125;</span><br><span class="line"><span class="selector-id">#chuncaiface</span> &#123;<span class="attribute">width</span>:<span class="number">160px</span>;<span class="attribute">height</span>:<span class="number">160px</span>;<span class="attribute">background-repeat</span>:no-repeat;<span class="attribute">position</span>:absolute;<span class="attribute">top</span>:<span class="number">0px</span>;<span class="attribute">left</span>:<span class="number">0px</span>;&#125;</span><br><span class="line"><span class="comment">/*#chuncaimenu &#123;width:46px;line-height:16px;float:left;font-size:12px;cursor:pointer;background-color:#666;color:#FFF;text-align:center;&#125;*/</span></span><br><span class="line"><span class="selector-id">#showchuncaimenu</span> &#123;<span class="attribute">float</span><span class="selector-pseudo">:left</span>;<span class="attribute">text-align</span><span class="selector-pseudo">:left</span>;<span class="attribute">width</span>:<span class="number">100%</span>;<span class="attribute">overflow</span>:hidden;<span class="attribute">display</span>:none;&#125;</span><br><span class="line"><span class="comment">/*#showchuncaimenu ul, */</span><span class="selector-id">#tempsaying</span> <span class="selector-tag">ul</span> &#123;<span class="attribute">margin</span>:<span class="number">1px</span> <span class="number">0px</span> <span class="number">0px</span> <span class="number">0px</span>;<span class="attribute">padding</span>:<span class="number">0px</span> <span class="number">0px</span> <span class="number">0px</span> <span class="number">5px</span>;<span class="attribute">float</span><span class="selector-pseudo">:left</span>;<span class="attribute">width</span>:<span class="number">100%</span>;<span class="attribute">line-height</span>:<span class="number">16px</span>;<span class="attribute">cursor</span>:pointer;<span class="attribute">overflow</span>:hidden;&#125;</span><br><span class="line"><span class="selector-class">.wcc_mlist</span> &#123;<span class="attribute">text-align</span>:center;<span class="attribute">width</span>:<span class="number">47%</span>;<span class="attribute">float</span><span class="selector-pseudo">:left</span>;<span class="attribute">line-height</span>:<span class="number">16px</span>;<span class="attribute">margin</span>:<span class="number">0</span>;<span class="attribute">padding</span>:<span class="number">0px</span> <span class="number">0px</span> <span class="number">4px</span> <span class="number">0px</span>;<span class="attribute">cursor</span>:pointer;<span class="attribute">overflow</span>:hidden;&#125;</span><br><span class="line"><span class="selector-id">#tempsaying</span> <span class="selector-tag">ul</span> &#123;<span class="attribute">width</span>:<span class="number">96%</span>;&#125;</span><br><span class="line"><span class="selector-id">#callchuncai</span> &#123;<span class="attribute">position</span>:fixed;<span class="attribute">width</span>:<span class="number">60px</span>;<span class="attribute">line-height</span>:<span class="number">16px</span>;<span class="attribute">cursor</span>:pointer;<span class="attribute">display</span>:none;<span class="attribute">font-size</span>:<span class="number">12px</span>;<span class="attribute">border</span>:<span class="number">1px</span> solid <span class="number">#e87a73</span>;<span class="attribute">background-color</span>:<span class="number">#FFF</span>;&#125;</span><br><span class="line">* <span class="selector-tag">html</span> <span class="selector-id">#callchuncai</span> &#123;<span class="attribute">position</span>:absolute;&#125;</span><br><span class="line"><span class="selector-id">#dialog_chat</span> &#123;<span class="attribute">position</span>:absolute;<span class="attribute">top</span>:<span class="number">0px</span>;<span class="attribute">left</span>:-<span class="number">205px</span>;<span class="attribute">width</span>:<span class="number">200px</span>;<span class="attribute">line-height</span>:<span class="number">23px</span>;<span class="attribute">text-align</span><span class="selector-pseudo">:left</span>;&#125;</span><br><span class="line"><span class="selector-id">#dialog_chat_loading</span> &#123;<span class="attribute">width</span>:<span class="number">200px</span>;<span class="attribute">height</span>:<span class="number">30px</span>;<span class="attribute">background</span>:<span class="built_in">url</span>(<span class="string">&quot;../imgs/loading.gif&quot;</span>) no-repeat center center;<span class="attribute">display</span>:none;&#125;</span><br><span class="line"><span class="selector-id">#chat_top</span> &#123;<span class="attribute">float</span><span class="selector-pseudo">:left</span>;<span class="attribute">width</span>:<span class="number">200px</span>;<span class="attribute">height</span>:<span class="number">5px</span>;<span class="attribute">overflow</span>:hidden;<span class="attribute">background</span>:<span class="built_in">url</span>(<span class="string">&quot;../imgs/chat_top.gif&quot;</span>) no-repeat;&#125;</span><br><span class="line"><span class="selector-id">#dialog_chat_contents</span>, <span class="selector-id">#chuncaisaying</span>, <span class="selector-id">#getmenu</span>, <span class="selector-id">#tempsaying</span> &#123;<span class="attribute">float</span><span class="selector-pseudo">:left</span>;<span class="attribute">margin</span>:<span class="number">0</span>;<span class="attribute">padding-left</span>:<span class="number">0px</span>;<span class="attribute">width</span>:<span class="number">198px</span>;<span class="attribute">line-height</span>:<span class="number">23px</span>;<span class="attribute">background-color</span>:<span class="number">#ffffee</span>;&#125;</span><br><span class="line"><span class="selector-id">#getmenu</span>, <span class="selector-id">#tempsaying</span>,<span class="selector-id">#chuncaisaying</span> &#123;<span class="attribute">padding</span>:<span class="number">0px</span> <span class="number">0px</span> <span class="number">0px</span> <span class="number">2px</span>; <span class="attribute">width</span>:<span class="number">196px</span>;&#125;</span><br><span class="line"><span class="selector-id">#dialog_chat_contents</span> &#123;<span class="attribute">width</span>:<span class="number">198px</span>;<span class="attribute">border-left</span>:<span class="number">1px</span> solid <span class="number">#e87a73</span>;<span class="attribute">border-right</span>:<span class="number">1px</span> solid <span class="number">#e87a73</span>;&#125;</span><br><span class="line"><span class="selector-id">#chat_bottom</span> &#123;<span class="attribute">width</span>:<span class="number">200px</span>;<span class="attribute">height</span>:<span class="number">10px</span>;<span class="attribute">float</span><span class="selector-pseudo">:left</span>;<span class="attribute">background</span>:<span class="built_in">url</span>(<span class="string">&quot;../imgs/chat_bottom.gif&quot;</span>) no-repeat;&#125;</span><br><span class="line"><span class="selector-id">#chat_top</span>, <span class="selector-id">#chat_bottom</span> &#123;&#125;</span><br><span class="line"><span class="selector-id">#tempsaying</span>, <span class="selector-id">#hiddenfaces</span> &#123;<span class="attribute">display</span>:none;&#125;</span><br><span class="line"><span class="selector-id">#getmenu</span> &#123;<span class="attribute">width</span>:<span class="number">95%</span>;<span class="attribute">height</span>:<span class="number">16px</span>;<span class="attribute">margin</span>:<span class="number">0</span>;<span class="attribute">padding</span>:<span class="number">0</span>;<span class="attribute">cursor</span>:pointer;<span class="attribute">background</span>:<span class="built_in">url</span>(<span class="string">&quot;../imgs/menu.jpg&quot;</span>) no-repeat top right;&#125;</span><br><span class="line"><span class="selector-id">#addinput</span> &#123;<span class="attribute">width</span>:<span class="number">240px</span>;<span class="attribute">height</span>:<span class="number">20px</span>;<span class="attribute">position</span>:absolute;<span class="attribute">top</span>:<span class="number">150px</span>;<span class="attribute">left</span>:-<span class="number">260px</span>;<span class="attribute">border</span>:<span class="number">1px</span> solid <span class="number">#888</span>;<span class="attribute">background-color</span>:<span class="number">#FFF</span>;<span class="attribute">padding-top</span>:<span class="number">2px</span>;<span class="attribute">overflow</span>:hidden;<span class="attribute">display</span>:none;&#125;</span><br><span class="line"><span class="selector-id">#inp_l</span> &#123;<span class="attribute">float</span><span class="selector-pseudo">:left</span>;<span class="attribute">width</span>:<span class="number">220px</span>;<span class="attribute">height</span>:<span class="number">20px</span>;&#125;</span><br><span class="line"><span class="selector-id">#inp_r</span> &#123;<span class="attribute">float</span><span class="selector-pseudo">:right</span>;<span class="attribute">width</span>:<span class="number">20px</span>;<span class="attribute">height</span>:<span class="number">20px</span>;<span class="attribute">font-size</span>:<span class="number">12px</span>;<span class="attribute">text-align</span>:center;<span class="attribute">cursor</span>:pointer;&#125;</span><br><span class="line"><span class="selector-id">#talk</span> &#123;<span class="attribute">border</span>:none;<span class="attribute">float</span><span class="selector-pseudo">:left</span>;<span class="attribute">width</span>:<span class="number">180px</span>;<span class="attribute">height</span>:<span class="number">16px</span>;&#125;</span><br><span class="line"><span class="selector-id">#talkto</span> &#123;<span class="attribute">float</span><span class="selector-pseudo">:left</span>;<span class="attribute">border</span>:none;<span class="attribute">width</span>:<span class="number">30px</span>;<span class="attribute">height</span>:<span class="number">16px</span>;<span class="attribute">background</span>:<span class="built_in">url</span>(<span class="string">&quot;../imgs/ok.jpg&quot;</span>);<span class="attribute">cursor</span>:pointer;&#125;</span><br></pre></td></tr></table></figure><br>{blogroot}/source/weichuncai/js/common.js<br><figure class="highlight javascript"><table><tr><td class="code"><pre><span class="line"><span class="keyword">var</span> smjq = jQuery;</span><br><span class="line"><span class="keyword">var</span> _typei = <span class="number">0</span>;</span><br><span class="line"><span class="keyword">var</span> weichuncai_text = <span class="string">&#x27;&#x27;</span>;</span><br><span class="line"><span class="title function_">smjq</span>(<span class="variable language_">document</span>).<span class="title function_">ready</span>(<span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">		<span class="keyword">var</span> getwidth = <span class="title function_">getCookie</span>(<span class="string">&quot;historywidth&quot;</span>);</span><br><span class="line">		<span class="keyword">var</span> getheight = <span class="title function_">getCookie</span>(<span class="string">&quot;historyheight&quot;</span>);</span><br><span class="line">		<span class="keyword">if</span>(getwidth != <span class="literal">null</span> &amp;&amp; getheight != <span class="literal">null</span>)&#123;</span><br><span class="line">			<span class="keyword">var</span> width = getwidth;</span><br><span class="line">			<span class="keyword">var</span> height = getheight;</span><br><span class="line">		&#125;<span class="keyword">else</span>&#123;</span><br><span class="line">			<span class="keyword">var</span> width = <span class="variable language_">document</span>.<span class="property">documentElement</span>.<span class="property">clientWidth</span>- <span class="number">200</span> - imagewidth;</span><br><span class="line">			<span class="keyword">var</span> height = <span class="variable language_">document</span>.<span class="property">documentElement</span>.<span class="property">clientHeight</span>- <span class="number">180</span> - imageheight;</span><br><span class="line">		&#125;</span><br><span class="line"></span><br><span class="line">		<span class="keyword">var</span> cwidth = <span class="variable language_">document</span>.<span class="property">documentElement</span>.<span class="property">clientWidth</span>-<span class="number">100</span>;</span><br><span class="line">		<span class="keyword">var</span> cheight = <span class="variable language_">document</span>.<span class="property">documentElement</span>.<span class="property">clientHeight</span>-<span class="number">20</span>;</span><br><span class="line">		<span class="comment">//var height = document.body.clientHeight-200;</span></span><br><span class="line">		<span class="keyword">var</span> moveX = <span class="number">0</span>;</span><br><span class="line">		<span class="keyword">var</span> moveY = <span class="number">0</span>;</span><br><span class="line">		<span class="keyword">var</span> moveTop = <span class="number">0</span>;</span><br><span class="line">		<span class="keyword">var</span> moveLeft = <span class="number">0</span>;</span><br><span class="line">		<span class="keyword">var</span> moveable = <span class="literal">false</span>;</span><br><span class="line">		<span class="keyword">var</span> docMouseMoveEvent = <span class="variable language_">document</span>.<span class="property">onmousemove</span>;</span><br><span class="line">		<span class="keyword">var</span> docMouseUpEvent = <span class="variable language_">document</span>.<span class="property">onmouseup</span>;</span><br><span class="line"></span><br><span class="line">		<span class="title function_">smjq</span>(<span class="string">&quot;body&quot;</span>).<span class="title function_">append</span>(<span class="string">&#x27;&lt;div id=&quot;smchuncai&quot; onfocus=&quot;this.blur();&quot; style=&quot;color:#626262;z-index:999;&quot;&gt;&lt;div id=&quot;chuncaiface&quot;&gt;&lt;/div&gt;&lt;div id=&quot;dialog_chat&quot;&gt;&lt;div id=&quot;chat_top&quot;&gt;&lt;/div&gt;&lt;div id=&quot;dialog_chat_contents&quot;&gt;&lt;div id=&quot;dialog_chat_loading&quot;&gt;&lt;/div&gt;&lt;div id=&quot;tempsaying&quot;&gt;&lt;/div&gt;&lt;div id=&quot;showchuncaimenu&quot;&gt;&lt;ul class=&quot;wcc_mlist&quot; id=&quot;shownotice&quot;&gt;显示公告&lt;/ul&gt;&lt;ul class=&quot;wcc_mlist&quot; id=&quot;chatTochuncai&quot;&gt;聊&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;天&lt;/ul&gt;&lt;ul class=&quot;wcc_mlist&quot; id=&quot;foods&quot;&gt;吃 零 食&lt;/ul&gt;&lt;ul class=&quot;wcc_mlist&quot; id=&quot;aboutmanage&quot;&gt;关&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;于&lt;/ul&gt;&lt;ul class=&quot;wcc_mlist&quot; id=&quot;lifetimechuncai&quot;&gt;生存时间&lt;/ul&gt;&lt;ul class=&quot;wcc_mlist&quot; id=&quot;closechuncai&quot;&gt;关闭春菜&lt;/ul&gt;&lt;/div&gt;&lt;div&gt;&lt;ul id=&quot;chuncaisaying&quot;&gt;&lt;/ul&gt;&lt;/div&gt;&lt;div id=&quot;getmenu&quot;&gt; &lt;/div&gt;&lt;/div&gt;&lt;div id=&quot;chat_bottom&quot;&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&#x27;</span>);</span><br><span class="line">		<span class="title function_">smjq</span>(<span class="string">&quot;#smchuncai&quot;</span>).<span class="title function_">append</span>(<span class="string">&#x27;&lt;div id=&quot;addinput&quot;&gt;&lt;div id=&quot;inp_l&quot;&gt;&lt;input id=&quot;talk&quot; type=&quot;text&quot; name=&quot;mastersay&quot; value=&quot;&quot; /&gt; &lt;input id=&quot;talkto&quot; type=&quot;button&quot; value=&quot; &quot; /&gt;&lt;/div&gt;&lt;div id=&quot;inp_r&quot;&gt; X &lt;/div&gt;&lt;/div&gt;&#x27;</span>);</span><br><span class="line">		<span class="title function_">smjq</span>(<span class="string">&quot;body&quot;</span>).<span class="title function_">append</span>(<span class="string">&#x27;&lt;div id=&quot;callchuncai&quot;&gt;召唤春菜&lt;/div&gt;&#x27;</span>);</span><br><span class="line">		<span class="comment">//判断春菜是否处于隐藏状态</span></span><br><span class="line">		<span class="keyword">var</span> is_closechuncai = <span class="title function_">getCookie</span>(<span class="string">&quot;is_closechuncai&quot;</span>);</span><br><span class="line">		<span class="keyword">if</span>(is_closechuncai == <span class="string">&#x27;close&#x27;</span>)&#123;</span><br><span class="line">			<span class="title function_">closechuncai_init</span>();</span><br><span class="line">		&#125;</span><br><span class="line">		<span class="comment">//设置初始状态</span></span><br><span class="line">		<span class="title function_">getdata</span>(<span class="string">&quot;getnotice&quot;</span>);</span><br><span class="line">		<span class="title function_">setFace</span>(<span class="number">1</span>);</span><br><span class="line"></span><br><span class="line">		<span class="title function_">smjq</span>(<span class="string">&quot;#smchuncai&quot;</span>).<span class="title function_">css</span>(<span class="string">&#x27;left&#x27;</span>, width+<span class="string">&#x27;px&#x27;</span>);</span><br><span class="line">		<span class="title function_">smjq</span>(<span class="string">&quot;#smchuncai&quot;</span>).<span class="title function_">css</span>(<span class="string">&#x27;top&#x27;</span>, height+<span class="string">&#x27;px&#x27;</span>);</span><br><span class="line">		<span class="title function_">smjq</span>(<span class="string">&quot;#smchuncai&quot;</span>).<span class="title function_">css</span>(<span class="string">&#x27;width&#x27;</span>, imagewidth+<span class="string">&#x27;px&#x27;</span>);</span><br><span class="line">		<span class="title function_">smjq</span>(<span class="string">&quot;#smchuncai&quot;</span>).<span class="title function_">css</span>(<span class="string">&#x27;height&#x27;</span>, imageheight+<span class="string">&#x27;px&#x27;</span>);</span><br><span class="line">		<span class="title function_">smjq</span>(<span class="string">&quot;#callchuncai&quot;</span>).<span class="title function_">attr</span>(<span class="string">&quot;style&quot;</span>, <span class="string">&quot;top:&quot;</span>+cheight+<span class="string">&quot;px; left:&quot;</span>+cwidth+<span class="string">&quot;px; text-align:center;&quot;</span>);</span><br><span class="line"></span><br><span class="line">		smcc = <span class="variable language_">document</span>.<span class="title function_">getElementById</span>(<span class="string">&quot;smchuncai&quot;</span>);</span><br><span class="line">		smcc.<span class="property">onmousedown</span> = <span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">			<span class="keyword">var</span> ent = <span class="title function_">getEvent</span>();</span><br><span class="line">			moveable = <span class="literal">true</span>;</span><br><span class="line">			moveX = ent.<span class="property">clientX</span>;</span><br><span class="line">			moveY = ent.<span class="property">clientY</span>;</span><br><span class="line">			<span class="keyword">var</span> obj = <span class="variable language_">document</span>.<span class="title function_">getElementById</span>(<span class="string">&quot;smchuncai&quot;</span>);</span><br><span class="line">			moveTop = <span class="built_in">parseInt</span>(obj.<span class="property">style</span>.<span class="property">top</span>);</span><br><span class="line">			moveLeft = <span class="built_in">parseInt</span>(obj.<span class="property">style</span>.<span class="property">left</span>);</span><br><span class="line">			<span class="keyword">if</span>(isFirefox=navigator.<span class="property">userAgent</span>.<span class="title function_">indexOf</span>(<span class="string">&quot;Firefox&quot;</span>)&gt;<span class="number">0</span>)&#123;</span><br><span class="line">				<span class="variable language_">window</span>.<span class="title function_">getSelection</span>().<span class="title function_">removeAllRanges</span>();</span><br><span class="line">			&#125;			</span><br><span class="line">			<span class="variable language_">document</span>.<span class="property">onmousemove</span> = <span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">				<span class="keyword">if</span>(moveable)&#123;</span><br><span class="line">					<span class="keyword">var</span> ent = <span class="title function_">getEvent</span>();</span><br><span class="line">					<span class="keyword">var</span> x = moveLeft + ent.<span class="property">clientX</span> - moveX;</span><br><span class="line">					<span class="keyword">var</span> y = moveTop + ent.<span class="property">clientY</span> - moveY;</span><br><span class="line">					<span class="keyword">var</span> w = <span class="number">200</span>;</span><br><span class="line">					<span class="keyword">var</span> h = <span class="number">200</span>;	<span class="comment">//w,h为浮层宽高</span></span><br><span class="line">					obj.<span class="property">style</span>.<span class="property">left</span> = x + <span class="string">&quot;px&quot;</span>;</span><br><span class="line">					obj.<span class="property">style</span>.<span class="property">top</span> = y + <span class="string">&quot;px&quot;</span>;</span><br><span class="line">				&#125;</span><br><span class="line">			&#125;;</span><br><span class="line">			<span class="variable language_">document</span>.<span class="property">onmouseup</span> = <span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">				<span class="keyword">if</span>(moveable)&#123;</span><br><span class="line">					<span class="keyword">var</span> historywidth = obj.<span class="property">style</span>.<span class="property">left</span>;</span><br><span class="line">					<span class="keyword">var</span> historyheight = obj.<span class="property">style</span>.<span class="property">top</span>;</span><br><span class="line">					historywidth = historywidth.<span class="title function_">replace</span>(<span class="string">&#x27;px&#x27;</span>, <span class="string">&#x27;&#x27;</span>);</span><br><span class="line">					historyheight = historyheight.<span class="title function_">replace</span>(<span class="string">&#x27;px&#x27;</span>, <span class="string">&#x27;&#x27;</span>);</span><br><span class="line">					<span class="title function_">setCookie</span>(<span class="string">&quot;historywidth&quot;</span>, historywidth, <span class="number">60</span>*<span class="number">60</span>*<span class="number">24</span>*<span class="number">30</span>*<span class="number">1000</span>);</span><br><span class="line">					<span class="title function_">setCookie</span>(<span class="string">&quot;historyheight&quot;</span>, historyheight, <span class="number">60</span>*<span class="number">60</span>*<span class="number">24</span>*<span class="number">30</span>*<span class="number">1000</span>);</span><br><span class="line">					<span class="variable language_">document</span>.<span class="property">onmousemove</span> = docMouseMoveEvent;</span><br><span class="line">					<span class="variable language_">document</span>.<span class="property">onmouseup</span> = docMouseUpEvent;</span><br><span class="line">					moveable = <span class="literal">false</span>; </span><br><span class="line">					moveX = <span class="number">0</span>;</span><br><span class="line">					moveY = <span class="number">0</span>;</span><br><span class="line">					moveTop = <span class="number">0</span>;</span><br><span class="line">					moveLeft = <span class="number">0</span>;</span><br><span class="line">				&#125;</span><br><span class="line">			&#125;</span><br><span class="line">		&#125;;</span><br><span class="line">		<span class="title function_">smjq</span>(<span class="string">&quot;#getmenu&quot;</span>).<span class="title function_">click</span>(<span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">				<span class="title function_">chuncaiMenu</span>();</span><br><span class="line">				<span class="title function_">setFace</span>(<span class="number">1</span>);</span><br><span class="line">				&#125;);</span><br><span class="line">		<span class="title function_">smjq</span>(<span class="string">&quot;#shownotice&quot;</span>).<span class="title function_">click</span>(<span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">				<span class="title function_">getdata</span>(<span class="string">&quot;getnotice&quot;</span>);</span><br><span class="line">                                <span class="title function_">setFace</span>(<span class="number">1</span>);</span><br><span class="line">		&#125;);</span><br><span class="line">		<span class="title function_">smjq</span>(<span class="string">&quot;#closechuncai&quot;</span>).<span class="title function_">click</span>(<span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">				<span class="title function_">setFace</span>(<span class="number">3</span>);</span><br><span class="line">				<span class="title function_">closechuncai</span>();</span><br><span class="line">				&#125;);</span><br><span class="line">		<span class="title function_">smjq</span>(<span class="string">&quot;#callchuncai&quot;</span>).<span class="title function_">click</span>(<span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">				<span class="title function_">setFace</span>(<span class="number">2</span>);</span><br><span class="line">				<span class="title function_">callchuncai</span>();</span><br><span class="line">				<span class="title function_">setCookie</span>(<span class="string">&quot;is_closechuncai&quot;</span>, <span class="string">&#x27;&#x27;</span>, <span class="number">60</span>*<span class="number">60</span>*<span class="number">24</span>*<span class="number">30</span>*<span class="number">1000</span>);</span><br><span class="line">				&#125;);</span><br><span class="line">		<span class="title function_">smjq</span>(<span class="string">&quot;#shownotice&quot;</span>).<span class="title function_">click</span>(<span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">				<span class="title function_">setFace</span>(<span class="number">1</span>);</span><br><span class="line">				<span class="title function_">closeChuncaiMenu</span>();</span><br><span class="line">				&#125;);</span><br><span class="line">		<span class="title function_">smjq</span>(<span class="string">&quot;#lifetimechuncai&quot;</span>).<span class="title function_">click</span>(<span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">				<span class="title function_">closeChuncaiMenu</span>();</span><br><span class="line">				<span class="title function_">closeNotice</span>();</span><br><span class="line">				<span class="title function_">setFace</span>(<span class="number">2</span>);</span><br><span class="line">				<span class="title function_">getdata</span>(<span class="string">&#x27;showlifetime&#x27;</span>);</span><br><span class="line">				&#125;);</span><br><span class="line">		<span class="title function_">smjq</span>(<span class="string">&quot;#chatTochuncai&quot;</span>).<span class="title function_">click</span>(<span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">				<span class="title function_">showInput</span>();</span><br><span class="line">				&#125;);</span><br><span class="line">		<span class="title function_">smjq</span>(<span class="string">&quot;#inp_r&quot;</span>).<span class="title function_">click</span>(<span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">				<span class="title function_">closeInput</span>();</span><br><span class="line">				<span class="title function_">chuncaiSay</span>(<span class="string">&#x27;不聊天了吗？(→_→)&#x27;</span>);</span><br><span class="line">				<span class="title function_">setFace</span>(<span class="number">3</span>);</span><br><span class="line">				&#125;);</span><br><span class="line">		<span class="title function_">smjq</span>(<span class="string">&quot;#talkto&quot;</span>).<span class="title function_">click</span>(<span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">				<span class="title function_">getdata</span>(<span class="string">&quot;talking&quot;</span>);</span><br><span class="line">				&#125;);</span><br><span class="line">		<span class="title function_">smjq</span>(<span class="string">&quot;#aboutmanage&quot;</span>).<span class="title function_">click</span>(<span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">				<span class="title function_">closeChuncaiMenu</span>();</span><br><span class="line">				<span class="title function_">closeNotice</span>();</span><br><span class="line">				<span class="title function_">smjq</span>(<span class="string">&quot;#getmenu&quot;</span>).<span class="title function_">css</span>(<span class="string">&quot;display&quot;</span>, <span class="string">&quot;none&quot;</span>);</span><br><span class="line">				<span class="title function_">chuncaiSay</span>(<span class="string">&quot;你想了解我主人？跟我来吧～～～&quot;</span>);</span><br><span class="line">				<span class="title function_">setFace</span>(<span class="number">2</span>);</span><br><span class="line">				<span class="built_in">setTimeout</span>(<span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">					<span class="variable language_">window</span>.<span class="property">location</span>.<span class="property">href</span> = _about_path ;</span><br><span class="line">					&#125;, <span class="number">2000</span>);</span><br><span class="line">				&#125;);</span><br><span class="line">		<span class="title function_">smjq</span>(<span class="string">&quot;#foods&quot;</span>).<span class="title function_">click</span>(<span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">				<span class="title function_">closeChuncaiMenu</span>();</span><br><span class="line">				<span class="title function_">closeNotice</span>();</span><br><span class="line">				<span class="title function_">getdata</span>(<span class="string">&quot;foods&quot;</span>);</span><br><span class="line">				&#125;);</span><br><span class="line"><span class="comment">/*		smjq(&quot;#showchuncaimenu&quot;).hover(function()&#123;</span></span><br><span class="line"><span class="comment">				&#125;,function()&#123;</span></span><br><span class="line"><span class="comment">				smjq(&quot;#showchuncaimenu&quot;).slideUp(&#x27;slow&#x27;).show();</span></span><br><span class="line"><span class="comment">				&#125;);*/</span></span><br><span class="line">		<span class="variable language_">document</span>.<span class="property">onmousemove</span> = <span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">			<span class="title function_">stoptime</span>();</span><br><span class="line">			tol = <span class="number">0</span>;</span><br><span class="line">			<span class="title function_">setTime</span>();</span><br><span class="line">			<span class="comment">//chuncaiSay(&quot;啊，野生的主人出现了！ ～～～O口O&quot;);</span></span><br><span class="line">		&#125;</span><br><span class="line">		<span class="title function_">talkSelf</span>(talktime);</span><br><span class="line">		<span class="variable language_">document</span>.<span class="title function_">getElementById</span>(<span class="string">&quot;smchuncai&quot;</span>).<span class="property">onmouseover</span> = <span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">			<span class="keyword">if</span>(talkobj)&#123;</span><br><span class="line">				<span class="built_in">clearTimeout</span>(talkobj);</span><br><span class="line">			&#125;</span><br><span class="line">			talktime = <span class="number">0</span>;</span><br><span class="line">			<span class="title function_">talkSelf</span>(talktime);</span><br><span class="line">		&#125;</span><br><span class="line">		&#125;);</span><br><span class="line"></span><br><span class="line"><span class="keyword">function</span> <span class="title function_">getEvent</span>(<span class="params"></span>) &#123;</span><br><span class="line">	<span class="keyword">return</span> <span class="variable language_">window</span>.<span class="property">event</span> || <span class="variable language_">arguments</span>.<span class="property">callee</span>.<span class="property">caller</span>.<span class="property">arguments</span>[<span class="number">0</span>];</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="keyword">var</span> eattimes = <span class="number">0</span>;</span><br><span class="line"><span class="keyword">function</span> <span class="title function_">eatfood</span>(<span class="params">obj</span>)&#123;</span><br><span class="line">	<span class="keyword">var</span> gettimes = <span class="title function_">getCookie</span>(<span class="string">&quot;eattimes&quot;</span>);</span><br><span class="line">	<span class="keyword">if</span>(<span class="built_in">parseInt</span>(gettimes) &gt; <span class="built_in">parseInt</span>(<span class="number">9</span>))&#123;</span><br><span class="line">		<span class="title function_">chuncaiSay</span>(<span class="string">&quot;主人是个大混蛋！！&quot;</span>);</span><br><span class="line">		<span class="title function_">setFace</span>(<span class="number">3</span>);</span><br><span class="line">		<span class="title function_">closechuncai_evil</span>();</span><br><span class="line">	&#125;<span class="keyword">else</span> <span class="keyword">if</span>(<span class="built_in">parseInt</span>(gettimes) &gt; <span class="built_in">parseInt</span>(<span class="number">7</span>))&#123;</span><br><span class="line">		<span class="title function_">chuncaiSay</span>(<span class="string">&quot;.....................肚子要炸了，死也不要再吃了～～！！！TAT&quot;</span>);</span><br><span class="line">		<span class="title function_">setFace</span>(<span class="number">3</span>);</span><br><span class="line">	&#125;<span class="keyword">else</span> <span class="keyword">if</span>(<span class="built_in">parseInt</span>(gettimes) == <span class="built_in">parseInt</span>(<span class="number">5</span>))&#123;</span><br><span class="line">		<span class="title function_">chuncaiSay</span>(<span class="string">&quot;我已经吃饱了，不要再吃啦......&quot;</span>);</span><br><span class="line">		<span class="title function_">setFace</span>(<span class="number">3</span>);</span><br><span class="line">	&#125;<span class="keyword">else</span> <span class="keyword">if</span>(<span class="built_in">parseInt</span>(gettimes) == <span class="built_in">parseInt</span>(<span class="number">3</span>))&#123;</span><br><span class="line">		<span class="title function_">chuncaiSay</span>(<span class="string">&quot;多谢款待，我吃饱啦～～～ ╰（￣▽￣）╭&quot;</span>);</span><br><span class="line">		<span class="title function_">setFace</span>(<span class="number">2</span>);</span><br><span class="line">	&#125;<span class="keyword">else</span>&#123;</span><br><span class="line">		<span class="keyword">var</span> id = obj.<span class="title function_">replace</span>(<span class="string">&quot;f&quot;</span>,<span class="string">&#x27;&#x27;</span>);</span><br><span class="line">		<span class="title function_">getdata</span>(<span class="string">&#x27;eatsay&#x27;</span>, id);</span><br><span class="line">	&#125;</span><br><span class="line">	eattimes++;</span><br><span class="line">	<span class="title function_">setCookie</span>(<span class="string">&quot;eattimes&quot;</span>, eattimes, <span class="number">60</span>*<span class="number">10</span>*<span class="number">1000</span>);</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">function</span> <span class="title function_">chuncaiMenu</span>(<span class="params"></span>)&#123;</span><br><span class="line">	<span class="comment">//smjq(&quot;#showchuncaimenu&quot;).slideDown(&#x27;fast&#x27;).show();</span></span><br><span class="line">	<span class="title function_">clearChuncaiSay</span>();</span><br><span class="line">	<span class="title function_">closeInput</span>();</span><br><span class="line">	<span class="title function_">chuncaiSay</span>(<span class="string">&quot;准备做什么呢？&quot;</span>);</span><br><span class="line">	<span class="title function_">smjq</span>(<span class="string">&quot;#showchuncaimenu&quot;</span>).<span class="title function_">css</span>(<span class="string">&quot;display&quot;</span>, <span class="string">&quot;block&quot;</span>);</span><br><span class="line">	<span class="title function_">smjq</span>(<span class="string">&quot;#getmenu&quot;</span>).<span class="title function_">css</span>(<span class="string">&quot;display&quot;</span>, <span class="string">&quot;none&quot;</span>);</span><br><span class="line">	<span class="title function_">smjq</span>(<span class="string">&quot;#chuncaisaying&quot;</span>).<span class="title function_">css</span>(<span class="string">&quot;display&quot;</span>, <span class="string">&quot;none&quot;</span>);</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">function</span> <span class="title function_">closeChuncaiMenu</span>(<span class="params"></span>)&#123;</span><br><span class="line">	<span class="title function_">clearChuncaiSay</span>();</span><br><span class="line">	<span class="title function_">smjq</span>(<span class="string">&quot;#showchuncaimenu&quot;</span>).<span class="title function_">css</span>(<span class="string">&quot;display&quot;</span>, <span class="string">&quot;none&quot;</span>);</span><br><span class="line">	<span class="comment">//smjq(&quot;#chuncaisaying&quot;).css(&quot;display&quot;, &quot;block&quot;);</span></span><br><span class="line">	<span class="title function_">showNotice</span>();</span><br><span class="line">	<span class="title function_">smjq</span>(<span class="string">&quot;#getmenu&quot;</span>).<span class="title function_">css</span>(<span class="string">&quot;display&quot;</span>, <span class="string">&quot;block&quot;</span>);</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">function</span> <span class="title function_">showNotice</span>(<span class="params"></span>)&#123;</span><br><span class="line">	<span class="title function_">smjq</span>(<span class="string">&quot;#chuncaisaying&quot;</span>).<span class="title function_">css</span>(<span class="string">&quot;display&quot;</span>, <span class="string">&quot;block&quot;</span>);</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">function</span> <span class="title function_">closechuncai</span>(<span class="params"></span>)&#123;</span><br><span class="line">	<span class="title function_">stopTalkSelf</span>();</span><br><span class="line">	<span class="title function_">chuncaiSay</span>(<span class="string">&quot;记得再叫我出来哦...&quot;</span>);</span><br><span class="line">	<span class="title function_">smjq</span>(<span class="string">&quot;#showchuncaimenu&quot;</span>).<span class="title function_">css</span>(<span class="string">&quot;display&quot;</span>, <span class="string">&quot;none&quot;</span>);</span><br><span class="line">	<span class="built_in">setTimeout</span>(<span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">			<span class="title function_">smjq</span>(<span class="string">&quot;#smchuncai&quot;</span>).<span class="title function_">fadeOut</span>(<span class="number">1200</span>);</span><br><span class="line">			<span class="title function_">smjq</span>(<span class="string">&quot;#callchuncai&quot;</span>).<span class="title function_">css</span>(<span class="string">&quot;display&quot;</span>, <span class="string">&quot;block&quot;</span>);&#125;, <span class="number">2000</span>);</span><br><span class="line">	<span class="comment">//保存关闭状态的春菜</span></span><br><span class="line">	<span class="title function_">setCookie</span>(<span class="string">&quot;is_closechuncai&quot;</span>, <span class="string">&#x27;close&#x27;</span>, <span class="number">60</span>*<span class="number">60</span>*<span class="number">24</span>*<span class="number">30</span>*<span class="number">1000</span>);</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">function</span> <span class="title function_">closechuncai_evil</span>(<span class="params"></span>)&#123;</span><br><span class="line">	<span class="title function_">stopTalkSelf</span>();</span><br><span class="line">	<span class="title function_">smjq</span>(<span class="string">&quot;#showchuncaimenu&quot;</span>).<span class="title function_">css</span>(<span class="string">&quot;display&quot;</span>, <span class="string">&quot;none&quot;</span>);</span><br><span class="line">	<span class="built_in">setTimeout</span>(<span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">			<span class="title function_">smjq</span>(<span class="string">&quot;#smchuncai&quot;</span>).<span class="title function_">fadeOut</span>(<span class="number">1200</span>);</span><br><span class="line">			<span class="title function_">smjq</span>(<span class="string">&quot;#callchuncai&quot;</span>).<span class="title function_">css</span>(<span class="string">&quot;display&quot;</span>, <span class="string">&quot;block&quot;</span>);&#125;, <span class="number">2000</span>);</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">function</span> <span class="title function_">closechuncai_init</span>(<span class="params"></span>)&#123;</span><br><span class="line">	<span class="title function_">stopTalkSelf</span>();</span><br><span class="line">	<span class="title function_">smjq</span>(<span class="string">&quot;#showchuncaimenu&quot;</span>).<span class="title function_">css</span>(<span class="string">&quot;display&quot;</span>, <span class="string">&quot;none&quot;</span>);</span><br><span class="line">	<span class="built_in">setTimeout</span>(<span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">			<span class="title function_">smjq</span>(<span class="string">&quot;#smchuncai&quot;</span>).<span class="title function_">css</span>(<span class="string">&quot;display&quot;</span>, <span class="string">&quot;none&quot;</span>);</span><br><span class="line">			<span class="title function_">smjq</span>(<span class="string">&quot;#callchuncai&quot;</span>).<span class="title function_">css</span>(<span class="string">&quot;display&quot;</span>, <span class="string">&quot;block&quot;</span>);&#125;, <span class="number">30</span>);</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">function</span> <span class="title function_">callchuncai</span>(<span class="params"></span>)&#123;</span><br><span class="line">	<span class="title function_">talkSelf</span>(talktime);</span><br><span class="line">	<span class="title function_">smjq</span>(<span class="string">&quot;#smchuncai&quot;</span>).<span class="title function_">fadeIn</span>(<span class="string">&#x27;normal&#x27;</span>);</span><br><span class="line">	<span class="title function_">smjq</span>(<span class="string">&quot;#callchuncai&quot;</span>).<span class="title function_">css</span>(<span class="string">&quot;display&quot;</span>, <span class="string">&quot;none&quot;</span>);</span><br><span class="line">	<span class="title function_">closeChuncaiMenu</span>();</span><br><span class="line">	<span class="title function_">closeNotice</span>();</span><br><span class="line">	<span class="title function_">chuncaiSay</span>(<span class="string">&quot;我回来啦～&quot;</span>);</span><br><span class="line">	<span class="title function_">setCookie</span>(<span class="string">&quot;is_closechuncai&quot;</span>, <span class="string">&#x27;&#x27;</span>, <span class="number">60</span>*<span class="number">60</span>*<span class="number">24</span>*<span class="number">30</span>*<span class="number">1000</span>);</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="keyword">function</span> <span class="title function_">chuncaiSay</span>(<span class="params">s</span>)&#123;</span><br><span class="line">	<span class="title function_">clearChuncaiSay</span>();</span><br><span class="line">	<span class="title function_">smjq</span>(<span class="string">&quot;#tempsaying&quot;</span>).<span class="title function_">append</span>(s);</span><br><span class="line">	<span class="title function_">smjq</span>(<span class="string">&quot;#tempsaying&quot;</span>).<span class="title function_">css</span>(<span class="string">&quot;display&quot;</span>, <span class="string">&quot;block&quot;</span>);</span><br><span class="line">	weichuncai_text = s;</span><br><span class="line">	<span class="title function_">typeWords</span>();</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">function</span> <span class="title function_">clearChuncaiSay</span>(<span class="params"></span>)&#123;</span><br><span class="line">	<span class="variable language_">document</span>.<span class="title function_">getElementById</span>(<span class="string">&quot;tempsaying&quot;</span>).<span class="property">innerHTML</span> = <span class="string">&#x27;&#x27;</span>;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">function</span> <span class="title function_">closeNotice</span>(<span class="params"></span>)&#123;</span><br><span class="line">	<span class="title function_">smjq</span>(<span class="string">&quot;#chuncaisaying&quot;</span>).<span class="title function_">css</span>(<span class="string">&quot;display&quot;</span>, <span class="string">&quot;none&quot;</span>);</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">function</span> <span class="title function_">showInput</span>(<span class="params"></span>)&#123;</span><br><span class="line">	<span class="title function_">closeChuncaiMenu</span>();</span><br><span class="line">	<span class="title function_">closeNotice</span>();</span><br><span class="line">	<span class="title function_">chuncaiSay</span>(<span class="string">&quot;............?&quot;</span>);</span><br><span class="line">	<span class="comment">//setFace(1);</span></span><br><span class="line">	<span class="title function_">smjq</span>(<span class="string">&quot;#addinput&quot;</span>).<span class="title function_">css</span>(<span class="string">&quot;display&quot;</span>, <span class="string">&quot;block&quot;</span>);</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">function</span> <span class="title function_">closeInput</span>(<span class="params"></span>)&#123;</span><br><span class="line">	<span class="title function_">setFace</span>(<span class="number">3</span>);</span><br><span class="line">	<span class="title function_">smjq</span>(<span class="string">&quot;#addinput&quot;</span>).<span class="title function_">css</span>(<span class="string">&quot;display&quot;</span>, <span class="string">&quot;none&quot;</span>);</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">function</span> <span class="title function_">clearInput</span>(<span class="params"></span>)&#123;</span><br><span class="line">	<span class="variable language_">document</span>.<span class="title function_">getElementById</span>(<span class="string">&quot;talk&quot;</span>).<span class="property">value</span> = <span class="string">&#x27;&#x27;</span>;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">function</span> <span class="title function_">createFace</span>(<span class="params">a, b, c</span>)&#123;</span><br><span class="line">	<span class="title function_">smjq</span>(<span class="string">&quot;head&quot;</span>).<span class="title function_">append</span>(<span class="string">&#x27;&lt;div id=&quot;hiddenfaces&quot;&gt;&lt;img id=&quot;hf1&quot; src=&quot;&#x27;</span>+a+<span class="string">&#x27;&quot; /&gt;&lt;img id=&quot;hf2&quot; src=&quot;&#x27;</span>+b+<span class="string">&#x27;&quot; /&gt;&lt;img id=&quot;hf3&quot; src=&quot;&#x27;</span>+c+<span class="string">&#x27;&quot; /&gt;&lt;/div&gt;&#x27;</span>);</span><br><span class="line">	<span class="title function_">setFace</span>(<span class="number">1</span>);</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">function</span> <span class="title function_">setFace</span>(<span class="params">num</span>)&#123;</span><br><span class="line">	obj = <span class="variable language_">document</span>.<span class="title function_">getElementById</span>(<span class="string">&quot;hf&quot;</span>+num).<span class="property">src</span>;</span><br><span class="line">	<span class="title function_">smjq</span>(<span class="string">&quot;#chuncaiface&quot;</span>).<span class="title function_">attr</span>(<span class="string">&quot;style&quot;</span>, <span class="string">&quot;background:url(&quot;</span>+obj+<span class="string">&quot;) no-repeat scroll 50% 0% transparent; width:&quot;</span>+imagewidth+<span class="string">&quot;px;height:&quot;</span>+imageheight+<span class="string">&quot;px;&quot;</span>);</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">function</span> <span class="title function_">getdata</span>(<span class="params">el, id</span>)&#123;</span><br><span class="line">	smjq.<span class="title function_">ajax</span>(&#123;</span><br><span class="line">		<span class="attr">type</span>:	<span class="string">&#x27;GET&#x27;</span>,</span><br><span class="line">		<span class="attr">url</span>:	_weichuncai_jsonpath,</span><br><span class="line">		<span class="attr">cache</span>:	<span class="string">&#x27;false&#x27;</span>,</span><br><span class="line">		<span class="attr">dataType</span>: <span class="string">&#x27;html&#x27;</span>,</span><br><span class="line">		<span class="attr">contentType</span>: <span class="string">&#x27;application/json; charset=utf8&#x27;</span>,</span><br><span class="line">		<span class="attr">beforeSend</span>: <span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">			<span class="comment">//smjq(&quot;#dialog_chat&quot;).fadeOut(&quot;normal&quot;);</span></span><br><span class="line">			<span class="title function_">smjq</span>(<span class="string">&quot;#tempsaying&quot;</span>).<span class="title function_">css</span>(<span class="string">&#x27;display&#x27;</span>, <span class="string">&quot;none&quot;</span>);</span><br><span class="line">			<span class="title function_">smjq</span>(<span class="string">&quot;#dialog_chat_loading&quot;</span>).<span class="title function_">fadeIn</span>(<span class="string">&quot;normal&quot;</span>);</span><br><span class="line">		&#125;,</span><br><span class="line">		<span class="attr">success</span>: <span class="keyword">function</span>(<span class="params">data</span>)&#123;</span><br><span class="line">			<span class="title function_">smjq</span>(<span class="string">&quot;#dialog_chat_loading&quot;</span>).<span class="title function_">css</span>(<span class="string">&#x27;display&#x27;</span>, <span class="string">&quot;none&quot;</span>);</span><br><span class="line">			<span class="comment">//smjq(&quot;#dialog_chat&quot;).fadeIn(&quot;normal&quot;);</span></span><br><span class="line">			<span class="title function_">smjq</span>(<span class="string">&quot;#tempsaying&quot;</span>).<span class="title function_">css</span>(<span class="string">&#x27;display&#x27;</span>, <span class="string">&quot;&quot;</span>);</span><br><span class="line">			<span class="keyword">var</span> dat = <span class="built_in">eval</span>(<span class="string">&quot;(&quot;</span>+data+<span class="string">&quot;)&quot;</span>);</span><br><span class="line">            <span class="keyword">if</span>(el == <span class="string">&#x27;getnotice&#x27;</span>)&#123;</span><br><span class="line">				<span class="title function_">chuncaiSay</span>(dat.<span class="property">notice</span>);</span><br><span class="line">				<span class="title function_">setFace</span>(<span class="number">1</span>);</span><br><span class="line">			&#125;<span class="keyword">else</span> <span class="keyword">if</span>(el == <span class="string">&#x27;showlifetime&#x27;</span>)&#123;</span><br><span class="line">				<span class="title class_">BirthDay</span>=<span class="keyword">new</span> <span class="title class_">Date</span>(dat.<span class="property">showlifetime</span>);<span class="comment">//建站日期</span></span><br><span class="line">				today=<span class="keyword">new</span> <span class="title class_">Date</span>();</span><br><span class="line">				timeold=(today.<span class="title function_">getTime</span>()-<span class="title class_">BirthDay</span>.<span class="title function_">getTime</span>());</span><br><span class="line">				sectimeold=timeold/<span class="number">1000</span></span><br><span class="line">				secondsold=<span class="title class_">Math</span>.<span class="title function_">floor</span>(sectimeold);</span><br><span class="line">				msPerDay=<span class="number">24</span>*<span class="number">60</span>*<span class="number">60</span>*<span class="number">1000</span></span><br><span class="line">				e_daysold=timeold/msPerDay</span><br><span class="line">				daysold=<span class="title class_">Math</span>.<span class="title function_">floor</span>(e_daysold);</span><br><span class="line">				e_hrsold=(daysold-e_daysold)*-<span class="number">24</span>;</span><br><span class="line">				hrsold=<span class="title class_">Math</span>.<span class="title function_">floor</span>(e_hrsold);</span><br><span class="line">				e_minsold=(hrsold-e_hrsold)*-<span class="number">60</span>;</span><br><span class="line">				minsold=<span class="title class_">Math</span>.<span class="title function_">floor</span>((hrsold-e_hrsold)*-<span class="number">60</span>);</span><br><span class="line">				seconds=<span class="title class_">Math</span>.<span class="title function_">floor</span>((minsold-e_minsold)*-<span class="number">60</span>);</span><br><span class="line">				<span class="title function_">chuncaiSay</span>(<span class="string">&quot;我已经与主人 一起生存了 &quot;</span>+daysold+<span class="string">&quot; 天 &quot;</span>+hrsold+<span class="string">&quot; 小时 &quot;</span>+minsold+<span class="string">&quot; 分钟 &quot;</span>+seconds+<span class="string">&quot; 秒的快乐时光啦～*^_^*&quot;</span>);</span><br><span class="line">			&#125;<span class="keyword">else</span> <span class="keyword">if</span>(el == <span class="string">&#x27;talking&#x27;</span>)&#123;</span><br><span class="line">				<span class="keyword">var</span> talkcon = <span class="title function_">smjq</span>(<span class="string">&quot;#talk&quot;</span>).<span class="title function_">val</span>();</span><br><span class="line">				<span class="keyword">var</span> i = <span class="title function_">in_array</span>(talkcon, dat.<span class="property">ques</span>);</span><br><span class="line">				<span class="keyword">var</span> types = <span class="title function_">typeof</span>(i);</span><br><span class="line">				<span class="keyword">if</span>(types != <span class="string">&#x27;boolean&#x27;</span>)&#123;</span><br><span class="line">					<span class="title function_">chuncaiSay</span>(dat.<span class="property">ans</span>[i]);</span><br><span class="line">					<span class="title function_">setFace</span>(<span class="number">2</span>);</span><br><span class="line">				&#125;<span class="keyword">else</span>&#123;</span><br><span class="line">					<span class="title function_">chuncaiSay</span>(<span class="string">&#x27;.......................嗯？&#x27;</span>);</span><br><span class="line">					<span class="title function_">setFace</span>(<span class="number">3</span>);</span><br><span class="line">				&#125;</span><br><span class="line">				<span class="title function_">clearInput</span>();</span><br><span class="line">			&#125;<span class="keyword">else</span> <span class="keyword">if</span>(el == <span class="string">&#x27;foods&#x27;</span>)&#123;</span><br><span class="line">				<span class="keyword">var</span> str=<span class="string">&#x27;&#x27;</span>;</span><br><span class="line">				<span class="keyword">var</span> arr = dat.<span class="property">foods</span>;</span><br><span class="line">				<span class="keyword">var</span> preg = <span class="regexp">/function/</span>;	</span><br><span class="line">				<span class="keyword">for</span>(<span class="keyword">var</span> i <span class="keyword">in</span> arr)&#123;</span><br><span class="line">					<span class="keyword">if</span>(arr[i] != <span class="string">&#x27;&#x27;</span> &amp;&amp; !preg.<span class="title function_">test</span>(arr[i]) )&#123;</span><br><span class="line">						str +=<span class="string">&#x27;&lt;ul id=&quot;f&#x27;</span>+i+<span class="string">&#x27;&quot; class=&quot;eatfood&quot; onclick=&quot;eatfood(this.id)&quot;&gt;&#x27;</span>+arr[i]+<span class="string">&#x27;&lt;/ul&gt;&#x27;</span>;</span><br><span class="line">					&#125;</span><br><span class="line">				&#125;</span><br><span class="line">				<span class="title function_">chuncaiSay</span>(str);</span><br><span class="line">			&#125;<span class="keyword">else</span> <span class="keyword">if</span>(el = <span class="string">&quot;eatsay&quot;</span>)&#123;</span><br><span class="line">				<span class="keyword">var</span> str = dat.<span class="property">eatsay</span>[id];</span><br><span class="line">				<span class="title function_">chuncaiSay</span>(str);</span><br><span class="line">				<span class="title function_">setFace</span>(<span class="number">2</span>);</span><br><span class="line">			&#125;<span class="keyword">else</span> <span class="keyword">if</span>(el = <span class="string">&quot;talkself&quot;</span>)&#123;</span><br><span class="line">				<span class="keyword">var</span> arr = dat.<span class="property">talkself</span>;</span><br><span class="line">				<span class="keyword">return</span> arr;</span><br><span class="line">			&#125;</span><br><span class="line">		&#125;,</span><br><span class="line">		<span class="attr">error</span>: <span class="keyword">function</span>(<span class="params"></span>)&#123;</span><br><span class="line">			<span class="title function_">chuncaiSay</span>(<span class="string">&#x27;好像出错了，是什么错误呢...请联系管理猿&#x27;</span>);</span><br><span class="line">		&#125;</span><br><span class="line">		&#125;);</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="keyword">function</span> <span class="title function_">in_array</span>(<span class="params">str, arr</span>)&#123;</span><br><span class="line">	<span class="keyword">for</span>(<span class="keyword">var</span> i <span class="keyword">in</span> arr)&#123;</span><br><span class="line">		<span class="keyword">if</span>(arr[i] == str)&#123;</span><br><span class="line">			<span class="keyword">return</span> i;</span><br><span class="line">		&#125;</span><br><span class="line">	&#125;</span><br><span class="line">	<span class="keyword">return</span> <span class="literal">false</span>;</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="keyword">var</span> timenum;</span><br><span class="line"><span class="keyword">var</span> tol=<span class="number">0</span>;</span><br><span class="line"><span class="comment">//10分钟后页面没有响应就停止活动</span></span><br><span class="line"><span class="keyword">var</span> goal = <span class="number">10</span>*<span class="number">60</span>;</span><br><span class="line"><span class="keyword">function</span> <span class="title function_">setTime</span>(<span class="params"></span>)&#123;</span><br><span class="line">	tol++;</span><br><span class="line">	<span class="comment">//document.body.innerHTML(tol);</span></span><br><span class="line">	timenum = <span class="variable language_">window</span>.<span class="built_in">setTimeout</span>(<span class="string">&quot;setTime(&#x27;&quot;</span>+tol+<span class="string">&quot;&#x27;)&quot;</span>, <span class="number">1000</span>);</span><br><span class="line">	<span class="keyword">if</span>(<span class="built_in">parseInt</span>(tol) == <span class="built_in">parseInt</span>(goal))&#123;</span><br><span class="line">		<span class="title function_">stopTalkSelf</span>();</span><br><span class="line">		<span class="title function_">closeChuncaiMenu</span>();</span><br><span class="line">		<span class="title function_">closeNotice</span>();</span><br><span class="line">		<span class="title function_">closeInput</span>();</span><br><span class="line">		<span class="title function_">chuncaiSay</span>(<span class="string">&quot;主人跑到哪里去了呢....&quot;</span>);</span><br><span class="line">		<span class="title function_">setFace</span>(<span class="number">3</span>);</span><br><span class="line">		<span class="title function_">stoptime</span>();</span><br><span class="line">	&#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">function</span> <span class="title function_">stoptime</span>(<span class="params"></span>)&#123;</span><br><span class="line">	<span class="keyword">if</span>(timenum)&#123;</span><br><span class="line">		<span class="built_in">clearTimeout</span>(timenum);</span><br><span class="line">	&#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">var</span> talktime = <span class="number">0</span>;</span><br><span class="line"><span class="comment">//设置自言自语频率（单位：秒）</span></span><br><span class="line"><span class="keyword">var</span> talkself = <span class="number">60</span>;</span><br><span class="line"><span class="keyword">var</span> talkobj;</span><br><span class="line"><span class="keyword">var</span> tsi = <span class="number">0</span>;</span><br><span class="line"><span class="keyword">var</span> talkself_arr = [</span><br><span class="line">	[<span class="string">&quot;白日依山尽，黄河入海流，欲穷千里目，更上.....一层楼？&quot;</span>, <span class="string">&quot;1&quot;</span>],</span><br><span class="line">	[<span class="string">&quot;我看见主人熊猫眼又加重了！&quot;</span>, <span class="string">&quot;3&quot;</span>],</span><br><span class="line">	[<span class="string">&quot;我是不是很厉害呀～～？&quot;</span>, <span class="string">&quot;2&quot;</span>],</span><br><span class="line">	[<span class="string">&quot;5555...昨天有个小孩子跟我抢棒棒糖吃.....&quot;</span>, <span class="string">&quot;3&quot;</span>],</span><br><span class="line">	[<span class="string">&quot;昨天我好像看见主人又在众人之前卖萌了哦～&quot;</span>, <span class="string">&quot;2&quot;</span>]</span><br><span class="line">];</span><br><span class="line"></span><br><span class="line"><span class="keyword">function</span> <span class="title function_">talkSelf</span>(<span class="params">talktime</span>)&#123;</span><br><span class="line">	talktime++;</span><br><span class="line">	<span class="keyword">var</span> yushu = talktime%talkself;</span><br><span class="line">	<span class="keyword">if</span>(<span class="built_in">parseInt</span>(yushu) == <span class="built_in">parseInt</span>(<span class="number">9</span>))&#123;</span><br><span class="line">		<span class="title function_">closeChuncaiMenu</span>();</span><br><span class="line">		<span class="title function_">closeNotice</span>();</span><br><span class="line">		<span class="title function_">closeInput</span>();</span><br><span class="line">		tsi = <span class="title class_">Math</span>.<span class="title function_">floor</span>(<span class="title class_">Math</span>.<span class="title function_">random</span>() * talkself_arr.<span class="property">length</span> + <span class="number">1</span>)-<span class="number">1</span>;</span><br><span class="line">		<span class="title function_">chuncaiSay</span>(talkself_arr[tsi][<span class="number">0</span>]);</span><br><span class="line">		<span class="title function_">setFace</span>(talkself_arr[tsi][<span class="number">1</span>]);</span><br><span class="line">	&#125;</span><br><span class="line">	talkobj = <span class="variable language_">window</span>.<span class="built_in">setTimeout</span>(<span class="string">&quot;talkSelf(&quot;</span>+talktime+<span class="string">&quot;)&quot;</span>, <span class="number">1000</span>);</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">function</span> <span class="title function_">stopTalkSelf</span>(<span class="params"></span>)&#123;</span><br><span class="line">	<span class="keyword">if</span>(talkobj)&#123;</span><br><span class="line">		<span class="built_in">clearTimeout</span>(talkobj);</span><br><span class="line">	&#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">function</span> <span class="title function_">arrayShuffle</span>(<span class="params">arr</span>)&#123;</span><br><span class="line">	<span class="keyword">var</span> result = [],</span><br><span class="line">	len = arr.<span class="property">length</span>;</span><br><span class="line">	<span class="keyword">while</span>(len--)&#123;</span><br><span class="line">		result[result.<span class="property">length</span>] = arr.<span class="title function_">splice</span>(<span class="title class_">Math</span>.<span class="title function_">floor</span>(<span class="title class_">Math</span>.<span class="title function_">random</span>()*(len+<span class="number">1</span>)),<span class="number">1</span>);</span><br><span class="line">	&#125;</span><br><span class="line">	<span class="keyword">return</span> result;</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"></span><br><span class="line"><span class="keyword">function</span> <span class="title function_">typeWords</span>(<span class="params"></span>) &#123;</span><br><span class="line">	<span class="keyword">var</span> p = <span class="number">1</span>;</span><br><span class="line">	<span class="keyword">var</span> str = weichuncai_text.<span class="title function_">substr</span>(<span class="number">0</span>,_typei);</span><br><span class="line">	<span class="keyword">var</span> w = weichuncai_text.<span class="title function_">substr</span>(_typei,<span class="number">1</span>);</span><br><span class="line">	<span class="keyword">if</span>(w==<span class="string">&quot;&lt;&quot;</span>)&#123;</span><br><span class="line">		str += weichuncai_text.<span class="title function_">substr</span>(_typei,weichuncai_text.<span class="title function_">substr</span>(_typei).<span class="title function_">indexOf</span>(<span class="string">&quot;&gt;&quot;</span>)+<span class="number">1</span>);</span><br><span class="line">		p= weichuncai_text.<span class="title function_">substr</span>(_typei).<span class="title function_">indexOf</span>(<span class="string">&quot;&gt;&quot;</span>)+<span class="number">1</span>;</span><br><span class="line">	&#125;</span><br><span class="line">	_typei+=p;</span><br><span class="line">	<span class="variable language_">document</span>.<span class="title function_">getElementById</span>(<span class="string">&quot;tempsaying&quot;</span>).<span class="property">innerHTML</span> = str;</span><br><span class="line">	txtst = <span class="built_in">setTimeout</span>(<span class="string">&quot;typeWords()&quot;</span>,<span class="number">20</span>);</span><br><span class="line">	<span class="keyword">if</span> (_typei&gt; weichuncai_text.<span class="property">length</span>)&#123;</span><br><span class="line">		<span class="built_in">clearTimeout</span>(txtst);</span><br><span class="line">		_typei = <span class="number">0</span>;</span><br><span class="line">	&#125;</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="keyword">function</span> <span class="title function_">setCookie</span>(<span class="params">name, val, ex</span>)&#123;</span><br><span class="line">	<span class="keyword">var</span> times = <span class="keyword">new</span> <span class="title class_">Date</span>();</span><br><span class="line">	times.<span class="title function_">setTime</span>(times.<span class="title function_">getTime</span>() + ex);</span><br><span class="line">	<span class="keyword">if</span>(ex == <span class="number">0</span>)&#123;</span><br><span class="line">		<span class="variable language_">document</span>.<span class="property">cookie</span> = name+<span class="string">&quot;=&quot;</span>+val+<span class="string">&quot;;&quot;</span>;</span><br><span class="line">	&#125;<span class="keyword">else</span>&#123;</span><br><span class="line">		<span class="variable language_">document</span>.<span class="property">cookie</span> = name+<span class="string">&quot;=&quot;</span>+val+<span class="string">&quot;; expires=&quot;</span>+times.<span class="title function_">toGMTString</span>();</span><br><span class="line">	&#125;</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="keyword">function</span> <span class="title function_">getCookie</span>(<span class="params">name</span>)&#123;</span><br><span class="line">	<span class="keyword">var</span> arr = <span class="variable language_">document</span>.<span class="property">cookie</span>.<span class="title function_">match</span>(<span class="keyword">new</span> <span class="title class_">RegExp</span>(<span class="string">&quot;(^| )&quot;</span>+name+<span class="string">&quot;=([^;]*)(;|$)&quot;</span>));   </span><br><span class="line">	<span class="keyword">if</span>(arr != <span class="literal">null</span>) <span class="keyword">return</span> <span class="built_in">unescape</span>(arr[<span class="number">2</span>]); <span class="keyword">return</span> <span class="literal">null</span>;</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure><br>{blogroot}/source/weichuncai/js/chuncai.json（这个地方可以自行配置）<br><figure class="highlight json"><table><tr><td class="code"><pre><span class="line"><span class="punctuation">&#123;</span></span><br><span class="line">    <span class="attr">&quot;notice&quot;</span><span class="punctuation">:</span> <span class="string">&quot;欢迎来到我的新家，没想到在2024我会被人注意到，真幸福~~&quot;</span><span class="punctuation">,</span></span><br><span class="line">    <span class="attr">&quot;ques&quot;</span><span class="punctuation">:</span> <span class="punctuation">[</span></span><br><span class="line">        <span class="string">&quot;早上好&quot;</span><span class="punctuation">,</span></span><br><span class="line">        <span class="string">&quot;中午好&quot;</span><span class="punctuation">,</span></span><br><span class="line">        <span class="string">&quot;下午好&quot;</span><span class="punctuation">,</span></span><br><span class="line">        <span class="string">&quot;晚上好&quot;</span><span class="punctuation">,</span></span><br><span class="line">        <span class="string">&quot;晚安&quot;</span></span><br><span class="line">    <span class="punctuation">]</span><span class="punctuation">,</span></span><br><span class="line">    <span class="attr">&quot;ans&quot;</span><span class="punctuation">:</span> <span class="punctuation">[</span></span><br><span class="line">        <span class="string">&quot;早上好～&quot;</span><span class="punctuation">,</span></span><br><span class="line">        <span class="string">&quot;中午好～&quot;</span><span class="punctuation">,</span></span><br><span class="line">        <span class="string">&quot;下午好～&quot;</span><span class="punctuation">,</span></span><br><span class="line">        <span class="string">&quot;晚上好～&quot;</span><span class="punctuation">,</span></span><br><span class="line">        <span class="string">&quot;晚安～&quot;</span></span><br><span class="line">    <span class="punctuation">]</span><span class="punctuation">,</span></span><br><span class="line">    <span class="attr">&quot;foods&quot;</span><span class="punctuation">:</span> <span class="punctuation">[</span></span><br><span class="line">        <span class="string">&quot;金坷垃&quot;</span><span class="punctuation">,</span></span><br><span class="line">        <span class="string">&quot;咸梅干&quot;</span></span><br><span class="line">    <span class="punctuation">]</span><span class="punctuation">,</span></span><br><span class="line">    <span class="attr">&quot;eatsay&quot;</span><span class="punctuation">:</span> <span class="punctuation">[</span></span><br><span class="line">        <span class="string">&quot;吃了金坷垃，一刀能秒一万八～！&quot;</span><span class="punctuation">,</span></span><br><span class="line">        <span class="string">&quot;吃咸梅干，变超人！哦耶～～～&quot;</span></span><br><span class="line">    <span class="punctuation">]</span><span class="punctuation">,</span></span><br><span class="line">    <span class="attr">&quot;showlifetime&quot;</span><span class="punctuation">:</span><span class="string">&quot;02-16-2024 15:30:00&quot;</span></span><br><span class="line"><span class="punctuation">&#125;</span></span><br></pre></td></tr></table></figure><br>{blogroot}/source/weichuncai/js/chuncai.json（这个地方可以自行配置）<br><figure class="highlight javascript"><table><tr><td class="code"><pre><span class="line"><span class="keyword">var</span> _about_path = <span class="string">&quot;https://blog.sinzmise.top/about&quot;</span>; <span class="comment">//你的关于页面地址</span></span><br><span class="line"><span class="keyword">var</span> _weichuncai_jsonpath = <span class="string">&quot;/weichuncai/chuncai.json&quot;</span>; <span class="comment">//chuncai.json的位置</span></span><br><span class="line"><span class="keyword">var</span> imagewidth = <span class="string">&#x27;85&#x27;</span>; <span class="comment">//人格长度</span></span><br><span class="line"><span class="keyword">var</span> imageheight = <span class="string">&#x27;152&#x27;</span>; <span class="comment">//人格高度</span></span><br><span class="line"><span class="comment">//设置人格的自言自语，前面的双引号是内容后面的双引号是人格表情，后面的1、2、3对应createFace设置的第几个表情</span></span><br><span class="line"><span class="keyword">var</span> talkself_arr = [</span><br><span class="line">  [<span class="string">&quot;白日依山尽，黄河入海流，欲穷千里目，更上.....一层楼？&quot;</span>, <span class="string">&quot;1&quot;</span>],</span><br><span class="line">  [<span class="string">&quot;我看见主人熊猫眼又加重了！&quot;</span>, <span class="string">&quot;3&quot;</span>],</span><br><span class="line">  [<span class="string">&quot;我是不是很厉害呀～～？&quot;</span>, <span class="string">&quot;2&quot;</span>],</span><br><span class="line">  [<span class="string">&quot;5555...昨天有个小孩子跟我抢棒棒糖吃.....&quot;</span>, <span class="string">&quot;3&quot;</span>]</span><br><span class="line">];</span><br><span class="line"><span class="comment">//设置表情</span></span><br><span class="line"><span class="title function_">createFace</span>(</span><br><span class="line">  <span class="string">&quot;https://dqapi.sininno.eu.org/weichuncai/skin/rakutori/face1.gif&quot;</span>, </span><br><span class="line">  <span class="string">&quot;https://dqapi.sininno.eu.org/weichuncai/skin/rakutori/face2.gif&quot;</span>, </span><br><span class="line">  <span class="string">&quot;https://dqapi.sininno.eu.org/weichuncai/skin/rakutori/face3.gif&quot;</span></span><br><span class="line">);</span><br></pre></td></tr></table></figure><br>butterfly、anzhiyu主题引入：<br><figure class="highlight yaml"><table><tr><td class="code"><pre><span class="line"><span class="comment"># Inject</span></span><br><span class="line"><span class="comment"># Insert the code to head (before &#x27;&lt;/head&gt;&#x27; tag) and the bottom (before &#x27;&lt;/body&gt;&#x27; tag)</span></span><br><span class="line"><span class="comment"># 插入代码到头部 &lt;/head&gt; 之前 和 底部 &lt;/body&gt; 之前</span></span><br><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="comment"># jQuery（必须在之前引入）</span></span><br><span class="line">    <span class="bullet">-</span> <span class="string">&lt;script</span> <span class="string">src=&quot;https://cdn.bootcdn.net/ajax/libs/jquery/3.6.3/jquery.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line">  <span class="attr">bottom:</span></span><br><span class="line">    <span class="comment"># 主体</span></span><br><span class="line">    <span class="bullet">-</span> <span class="string">&lt;link</span> <span class="string">rel=&quot;stylesheet&quot;</span> <span class="string">type=&quot;text/css&quot;</span> <span class="string">href=&quot;/weichuncai/css/style.css&quot;&gt;</span></span><br><span class="line">    <span class="bullet">-</span> <span class="string">&lt;script</span> <span class="string">src=&quot;/weichuncai/js/common.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line">    <span class="bullet">-</span> <span class="string">&lt;script</span> <span class="string">src=&quot;/weichuncai/wcc-config.js&quot;&gt;&lt;/script&gt;</span></span><br></pre></td></tr></table></figure></p>
+<h1 id="后记"><a href="#后记" class="headerlink" title="后记"></a>后记</h1><p>我为什么会将伪春菜定义为桌面精灵而不是桌宠？<br>是因为相比于桌宠来说，伪春菜比桌宠的功能还多得多<br>因此我即使开着虚拟桌宠模拟器，我有时也会开着伪春菜<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240216/ssp_OgKZgUjISo.1rssdhcjowjk.webp" alt="ssp_OgKZgUjISo"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>（甚至我电脑卡的时候也会提醒我，虽然我电脑没有卡死QWQ）</p>
+<p>还有，我之前看<a href="https://steve02081504.github.io/2020/02/27/about-kikka/">关于Kikka</a>这篇文章，有一句话很吸引我：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20240216/msedge_h7th45Tk9U.47mkdav98180.webp" alt="msedge_h7th45Tk9U"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>也据此可以看出，在2020年，伪春菜这个圈子越来越难活下去<br>更何况现在是2024。。。。。。</p>
+<p>但不管怎么说，还是有人在用这个桌面精灵的，至少有我一个。。。。。。<br>后面我打算写个有关伪春菜的配置教程吧。。。。。。</p>
+]]></content>
+      <categories>
+        <category>站点折腾</category>
+      </categories>
+      <tags>
+        <tag>站点折腾</tag>
+        <tag>悬浮宠物/看板娘</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>自建Meting服务</title>
+    <url>/posts/61417/</url>
+    <content><![CDATA[<h1 id="前言"><a href="#前言" class="headerlink" title="前言"></a>前言</h1><p>听人说Meting官方API证书过期了，也就是说MetingAPI得自建了<br>然后很快啊，有人就搞出了自建MetingAPI的Vercel版本</p>
+<h1 id="教程"><a href="#教程" class="headerlink" title="教程"></a>教程</h1><h2 id="后端部署"><a href="#后端部署" class="headerlink" title="后端部署"></a>后端部署</h2><div class="trm-tabs" id="后端部署"><ul class="trm-nav-tabs"><li class="trm-tab active"><button type="button" data-href="#后端部署-1">Vercel部署（推荐）</button></li><li class="trm-tab"><button type="button" data-href="#后端部署-2">服务器部署</button></li></ul><div class="trm-tab-contents"><div class="trm-tab-item-content active" id="后端部署-1"><p>点击下方按钮，跳转至 Vercel：<br><a href="https://vercel.com/import/project?template=https://github.com/xizeyoupan/Meting-API"><img src="https://vercel.com/button" alt="跳转到Vercel"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></a><br>名字随便写，然后点击“Create”<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230119/msedge_4fdyFO3sCF.7hpgbpasakc0.webp" alt="msedge_4fdyFO3sCF"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>看到这个就算成功了<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230119/msedge_fs4WGcMy4l.326qjm58vf20.webp" alt="msedge_fs4WGcMy4l"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p></div><div class="trm-tab-item-content" id="后端部署-2"><p>去<a href="https://github.com/injahow/meting-api/releases">https://github.com/injahow/meting-api/releases</a> 下载编译好的压缩包上传到服务器上（服务器必须开启跨域！）</p></div></div></div>
+<h2 id="前端部署"><a href="#前端部署" class="headerlink" title="前端部署"></a>前端部署</h2><h3 id="Butterfly主题"><a href="#Butterfly主题" class="headerlink" title="Butterfly主题"></a>Butterfly主题</h3><p>编辑[Blogroot]\themes\butterfly\layout\includes\third-party\aplayer.pug<br><figure class="highlight diff"><table><tr><td class="code"><pre><span class="line">link(rel=&#x27;stylesheet&#x27; href=url_for(theme.asset.aplayer_css) media=&quot;print&quot; onload=&quot;this.media=&#x27;all&#x27;&quot;)</span><br><span class="line">script(src=url_for(theme.asset.aplayer_js))</span><br><span class="line">script(src=url_for(theme.asset.meting_js))</span><br><span class="line"><span class="addition">+ script.</span></span><br><span class="line"><span class="addition">+   var meting_api=&#x27;https://（你的api地址）/api/?server=:server&amp;type=:type&amp;id=:id&amp;auth=:auth&amp;r=:r&#x27;;</span></span><br></pre></td></tr></table></figure></p>
+<h3 id="HTML代码"><a href="#HTML代码" class="headerlink" title="HTML代码"></a>HTML代码</h3><figure class="highlight html"><table><tr><td class="code"><pre><span class="line"><span class="tag">&lt;<span class="name">script</span>&gt;</span><span class="language-javascript"></span></span><br><span class="line"><span class="language-javascript"><span class="keyword">var</span> meting_api=<span class="string">&#x27;https://（你的api地址）/api/?server=:server&amp;type=:type&amp;id=:id&amp;auth=:auth&amp;r=:r&#x27;</span>;</span></span><br><span class="line"><span class="language-javascript"></span><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span><br></pre></td></tr></table></figure>]]></content>
+      <categories>
+        <category>站点折腾</category>
+      </categories>
+      <tags>
+        <tag>站点折腾</tag>
+        <tag>自建部署</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>自建不蒜子API</title>
+    <url>/posts/28536/</url>
+    <content><![CDATA[<h1 id="前言"><a href="#前言" class="headerlink" title="前言"></a>前言</h1><p><a href="https://busuanzi.ibruce.info/">不蒜子</a>是一款很好用的前端计数工具，但是因为流量日渐变多，经常会出现 502 的情况<br>于是就找到了<a href="https://github.com/soxft/busuanzi">soxft/busuanzi</a>，然后用docker成功在Koyeb上部署不蒜子<br>但是由于这个不蒜子没有Web 管理面板，而如果之前使用的是其他程序统计访问量，切换到使用 busuanzi 来统计，就需要修改访问量<br>所以我基于<a href="https://github.com/yuantuo666/busuanzi">yuantuo666/busuanzi</a>这个版本的不蒜子魔改，然后将其部署到docker和ghcr里面<br>然后这个教程就诞生了（bushi</p>
+<h1 id="Koyeb部署"><a href="#Koyeb部署" class="headerlink" title="Koyeb部署"></a>Koyeb部署</h1><h2 id="Redis数据库"><a href="#Redis数据库" class="headerlink" title="Redis数据库"></a>Redis数据库</h2><p>这个不蒜子默认用的Redis数据库，这边推荐<a href="https://upstash.com/">upstash</a><br>直接注册个账号然后新建个项目<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/msedge_NKCiPPkXqL.png" alt=""  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>复制这里面的数据库地址（后面的“:”和端口要复制下来！）和密码</p>
+<h2 id="正式开始部署"><a href="#正式开始部署" class="headerlink" title="正式开始部署"></a>正式开始部署</h2><p>老样子，注册个koyeb账号<br>注册koyeb账号必须开t才没有银行卡验证的选项<br>(注册过koyeb账号且没有部署项目就不用这个步骤)<br>然后再新建个Web Service<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/msedge_Kd4LmCDhpM.png" alt=""  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>选择docker<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/msedge_rAnK6dlRB5.png" alt=""  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>image填写<code>docker.io/szninty/busuanzi:houtai</code>或者<code>ghcr.io/SinzMise/busuanzi</code><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/msedge_TZkQypDvYW.png" alt=""  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>划到下面，点击Advanced，添加环境变量<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/msedge_rZ7fnbMSfz.png" alt=""  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>| Name      | Value |必选|<br>| —————- | —————- | —————- |<br>|API_SERVER|busuanzi.js API地址 需要转译|√|<br>|REDIS_ADDR|Redis 数据库地址（带端口）|√|<br>|REDIS_PWD|Redis 密码|√|<br>|JWT_SECRET|JWT加密秘钥，可乱填|√|<br>|ADMIN_PASSWORD|后台管理密码|√|<br>|LOG_ENABLE|是否开启日志，默认 true||<br>下面的port改为<code>8080</code><br>准备好了之后可以点击deploy，等一会就可以体验到不蒜子了</p>
+]]></content>
+      <categories>
+        <category>站点折腾</category>
+      </categories>
+      <tags>
+        <tag>站点折腾</tag>
+        <tag>自建部署</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>萌ICP备异次元之旅</title>
+    <url>/posts/58203/</url>
+    <content><![CDATA[<h1 id="前言"><a href="#前言" class="headerlink" title="前言"></a>前言</h1><p>今天在修改我那萌备的时候，无意在导航栏上看到了“异次元”这玩意<br>看主页是类似于“开往”，只不过仅跳转到萌备详情页面而不是直接进入站点<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/20230724/msedge_OyAWChkztM.5m8n4321oak0.webp" alt="msedge_OyAWChkztM"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>又因为我站点已经加入了萌ICP备，所以我就将这玩意添加到底部列表里面了</p>
+<h1 id="添加方法"><a href="#添加方法" class="headerlink" title="添加方法"></a>添加方法</h1><p>如果没有你没有加入萌ICP备豪华套餐的话，点击这里加入：<a href="https://icp.gov.moe/join.php">加入萌备</a><br>如果你加入了，那么按照 <a href="https://moe.one/thread-254.htm">https://moe.one/thread-254.htm</a> 里的配色方案添加</p>
+]]></content>
+      <categories>
+        <category>站点折腾</category>
+      </categories>
+      <tags>
+        <tag>站点折腾</tag>
+        <tag>站点底部魔改</tag>
+      </tags>
+  </entry>
+  <entry>
+    <title>马里奥制造1打百人团教程</title>
+    <url>/posts/10996/</url>
+    <content><![CDATA[<p>不知道什么时候，我开始玩马里奥制造（以下简称“马造”）了<br>但是我没有Switch，模拟器配置较为麻烦，所以我没法玩马造2，只能玩玩马造1<br>然而在2024年4月9日，任天堂 3DS / WiiU 在线功能停服</p>
+<p>在停服之前，我就一直知道马造1有私服，但是这玩意之前不知道为啥总配置失败<br>现在倒是配置好了，话不多说，游玩教程开始！</p>
+<h1 id="下载懒人包"><a href="#下载懒人包" class="headerlink" title="下载懒人包"></a>下载懒人包</h1><p>这玩意我已经打包成为一个懒人包了<br>大伙想要的可以下载：</p>
+<div class="btns rounded grid5">
+            <a class="button" href='https://pan.sinzmise.top/SMM/SMM.7z' title='懒人包链接'><i class='fas fa-download'></i>懒人包链接</a>
+          </div>
+<p>下载完成之后先点击Start启动服务端<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/SmmServer_5kCtRQwhp0.5mnlvwyhv7.webp" alt="SmmServer_5kCtRQwhp0"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></p>
+<div class="tip success"><p>正常情况下的这四个的提示是这样的：</p>
+<ul>
+<li>NEX（SMM） 占用端口59900和59921<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/SmmServer_ONoCeAxy5j.7awyt3pvwx.webp" alt="SmmServer_ONoCeAxy5j"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></li>
+<li>NEX（Friends）占用端口60000和60021<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/SmmServer_H0VbUAIUgS.4xucbwc9yi.webp" alt="SmmServer_H0VbUAIUgS"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></li>
+<li>Pretando++ 占用端口8383<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/SmmServer_NY1UtocxVh.7awyt3q0js.webp" alt="SmmServer_NY1UtocxVh"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></li>
+<li>Caddy 占用端口80和443<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/SmmServer_Hngcypv9AG.6ik3bd9cqv.webp" alt="SmmServer_Hngcypv9AG"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'></li>
+</ul>
+</div>
+<div class="tip warning"><p><strong><em>请注意：</em></strong><br>如果出现异常的话<br>十有八九可能是端口被占用了<br>请先用<code>netstat -ano|findstr 程序对应的端口号</code>查看端口有没有被占用<br>如果端口被侵占了，输入<code>taskkill /t /f /im 进程号</code>关闭占用端口的进程<br>如果还是不行的话。。。。加Q群问（在最下方）</p>
+</div>
+<p>一切正常的话，点击“Start Cemu”打开模拟器<strong><em>注意：必须用自带的模拟器！要不然打开马造世界关卡会提示106-0502错误</em></strong><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/picx-images-hosting@master/SmmServer_zKuO6e7rGt.4xucbwm194.webp" alt="SmmServer_zKuO6e7rGt"  data-tag='post-image' loading="lazy" onerror='this.onerror=null;this.src="/img/404.jpg"'><br>然后双击Super Mario Maker，等待加载完成便可以游玩了！</p>
+<psw>这可能是我写博客以来第一次写这么简短的教程</psw>]]></content>
+      <categories>
+        <category>游戏相关</category>
+      </categories>
+      <tags>
+        <tag>游戏相关</tag>
+        <tag>其它游戏</tag>
+      </tags>
+  </entry>
+</search>