8.7
This commit is contained in:
小赵同学 committed
1 parent
e56031cfcc
commit
d4b2cd4b92
80 files changed
+876
-339
No files matched your search
+153
-1
@@ -6,7 +6,159 @@
|
||||
<description></description>
|
||||
<generator>Hugo -- gohugo.io</generator>
|
||||
<language>zh-cn</language>
|
||||
<lastBuildDate>Wed, 07 Aug 2024 16:07:54 +0800</lastBuildDate><atom:link href="https://usj.cc/rss.xml" rel="self" type="application/rss+xml" />
|
||||
<lastBuildDate>Wed, 07 Aug 2024 16:10:05 +0800</lastBuildDate><atom:link href="https://usj.cc/rss.xml" rel="self" type="application/rss+xml" />
|
||||
<item>
|
||||
<title>添加ikun摆件</title>
|
||||
<link>https://usj.cc/post/ikun/</link>
|
||||
<pubDate>Wed, 07 Aug 2024 16:10:05 +0800</pubDate>
|
||||
|
||||
<guid>https://usj.cc/post/ikun/</guid>
|
||||
<description>近日，在浏览GitHub时，首页推送了一个这样的项目，无意点进去，试玩了一下 还是很有意思的，按住人物的立牌拖拽、松手后立牌会向反方向弹跳，还</description>
|
||||
|
||||
<content:encoded><![CDATA[<img loading="lazy" decoding="async" src="/" alt="添加ikun摆件" /><p>近日，在浏览GitHub时，首页推送了一个这样的项目，无意点进去，试玩了一下</p>
|
||||
<p>还是很有意思的，按住人物的立牌拖拽、松手后立牌会向反方向弹跳，还有惯性力效果</p>
|
||||
<p>主要是还自带音效，在适当区间松手时还会触发语音效果</p>
|
||||
<p>
|
||||
<a
|
||||
|
||||
href="/tiaozhuan/index.html?target=aHR0cHM6Ly9naXRodWIuY29tL2l0b3JyL3Nha2FuYQ%3d%3d"
|
||||
|
||||
target="_blank"
|
||||
>
|
||||
https://github.com/itorr/sakana</a> 「Sakana!」石蒜模拟器</p>
|
||||
<p>预览地址：https://lab.magiconch.com/sakana</p>
|
||||
<h4 id="继续整活">继续整活</h4>
|
||||
<p>因为主题是单栏风格，内容的两边有很多留白，所以思来想去，决定把这个摆件整合进来</p>
|
||||
<p>作为一个合格的ikun，当然也少不了整活，于是研究一下源码，修改源码，一气呵成</p>
|
||||
<p>为了方便维护，将语音包进行base64转码，于是乎就实现了以下效果，鼠标拖拽，适当角度就会触发语音包</p>
|
||||
<p>
|
||||
<img data-lazy-src="/pics/hugo/ikun/image-20240807153134059.png" alt="image-20240807153134059" class="lazyload"></p>
|
||||
<h4 id="快速食用">快速食用</h4>
|
||||
<p>考虑到很多小伙伴也需要，这里把代码梳理一下 发出来</p>
|
||||
<p>将以下css加入主题的<!-- raw HTML omitted --><!-- raw HTML omitted -->标签的<!-- raw HTML omitted --><!-- raw HTML omitted -->标签里</p>
|
||||
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>.<span style="color:#a6e22e">sakana-box-l</span><span style="color:#f92672">,</span>
|
||||
</span></span><span style="display:flex;"><span>.<span style="color:#a6e22e">sakana-box-r</span> {
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">position</span>: <span style="color:#66d9ef">fixed</span> <span style="color:#75715e">!important</span>;
|
||||
</span></span><span style="display:flex;"><span> inset: <span style="color:#66d9ef">auto</span> <span style="color:#66d9ef">auto</span> <span style="color:#ae81ff">-1</span><span style="color:#66d9ef">rem</span> <span style="color:#ae81ff">-5</span><span style="color:#66d9ef">rem</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">z-index</span>: <span style="color:#ae81ff">555</span>;
|
||||
</span></span><span style="display:flex;"><span>}
|
||||
</span></span><span style="display:flex;"><span>
|
||||
</span></span><span style="display:flex;"><span>.<span style="color:#a6e22e">sakana-box-r</span> {
|
||||
</span></span><span style="display:flex;"><span> inset: <span style="color:#66d9ef">auto</span> <span style="color:#ae81ff">-5</span><span style="color:#66d9ef">rem</span> <span style="color:#ae81ff">-1</span><span style="color:#66d9ef">rem</span> <span style="color:#66d9ef">auto</span>;
|
||||
</span></span><span style="display:flex;"><span>}
|
||||
</span></span><span style="display:flex;"><span>
|
||||
</span></span><span style="display:flex;"><span>@<span style="color:#66d9ef">media</span> <span style="color:#f92672">(</span><span style="color:#f92672">max-width</span><span style="color:#f92672">:</span> <span style="color:#f92672">650px</span><span style="color:#f92672">)</span> {
|
||||
</span></span><span style="display:flex;"><span> .<span style="color:#a6e22e">sakana-box-l</span><span style="color:#f92672">,</span>
|
||||
</span></span><span style="display:flex;"><span> .<span style="color:#a6e22e">sakana-box-r</span> {
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">display</span>: <span style="color:#66d9ef">none</span>;
|
||||
</span></span><span style="display:flex;"><span> }
|
||||
</span></span><span style="display:flex;"><span>}
|
||||
</span></span><span style="display:flex;"><span>
|
||||
</span></span><span style="display:flex;"><span>@<span style="color:#66d9ef">media</span> <span style="color:#f92672">(</span><span style="color:#f92672">max-width</span><span style="color:#f92672">:</span> <span style="color:#f92672">1120px</span><span style="color:#f92672">)</span> {
|
||||
</span></span><span style="display:flex;"><span> .<span style="color:#a6e22e">sakana-box-l</span><span style="color:#f92672">,</span>
|
||||
</span></span><span style="display:flex;"><span> .<span style="color:#a6e22e">sakana-box-r</span> {
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">transform</span>: translateY(<span style="color:#ae81ff">0</span><span style="color:#66d9ef">px</span>) scale(<span style="color:#ae81ff">0.25</span>) <span style="color:#75715e">!important</span>;
|
||||
</span></span><span style="display:flex;"><span> }
|
||||
</span></span><span style="display:flex;"><span>
|
||||
</span></span><span style="display:flex;"><span> .<span style="color:#a6e22e">sakana-box-l</span> {
|
||||
</span></span><span style="display:flex;"><span> inset: <span style="color:#66d9ef">auto</span> <span style="color:#66d9ef">auto</span> <span style="color:#ae81ff">-1</span><span style="color:#66d9ef">rem</span> <span style="color:#ae81ff">-10</span><span style="color:#66d9ef">rem</span>;
|
||||
</span></span><span style="display:flex;"><span> }
|
||||
</span></span><span style="display:flex;"><span>
|
||||
</span></span><span style="display:flex;"><span> .<span style="color:#a6e22e">sakana-box-r</span> {
|
||||
</span></span><span style="display:flex;"><span> inset: <span style="color:#66d9ef">auto</span> <span style="color:#ae81ff">-10</span><span style="color:#66d9ef">rem</span> <span style="color:#ae81ff">-1</span><span style="color:#66d9ef">rem</span> <span style="color:#66d9ef">auto</span>;
|
||||
</span></span><span style="display:flex;"><span> }
|
||||
</span></span><span style="display:flex;"><span>}
|
||||
</span></span><span style="display:flex;"><span>
|
||||
</span></span><span style="display:flex;"><span>.<span style="color:#a6e22e">sakana-box</span> {
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">width</span>: <span style="color:#ae81ff">500</span><span style="color:#66d9ef">px</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">height</span>: <span style="color:#ae81ff">800</span><span style="color:#66d9ef">px</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">position</span>: <span style="color:#66d9ef">relative</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">transform-origin</span>: <span style="color:#ae81ff">50</span><span style="color:#66d9ef">%</span> <span style="color:#ae81ff">100</span><span style="color:#66d9ef">%</span>;
|
||||
</span></span><span style="display:flex;"><span> pointer-events: <span style="color:#66d9ef">none</span>;
|
||||
</span></span><span style="display:flex;"><span>}
|
||||
</span></span><span style="display:flex;"><span>
|
||||
</span></span><span style="display:flex;"><span>.<span style="color:#a6e22e">sakana-box</span> <span style="color:#f92672">canvas</span> {
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">position</span>: <span style="color:#66d9ef">absolute</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">left</span>: <span style="color:#ae81ff">0</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">right</span>: <span style="color:#ae81ff">0</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">bottom</span>: <span style="color:#ae81ff">0</span>;
|
||||
</span></span><span style="display:flex;"><span> pointer-events: <span style="color:#66d9ef">none</span>;
|
||||
</span></span><span style="display:flex;"><span>}
|
||||
</span></span><span style="display:flex;"><span>
|
||||
</span></span><span style="display:flex;"><span>.<span style="color:#a6e22e">sakana-box</span> .<span style="color:#a6e22e">sakana-character</span> {
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">width</span>: <span style="color:#ae81ff">300</span><span style="color:#66d9ef">px</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">height</span>: <span style="color:#ae81ff">300</span><span style="color:#66d9ef">px</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">position</span>: <span style="color:#66d9ef">absolute</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">left</span>: <span style="color:#ae81ff">0</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">right</span>: <span style="color:#ae81ff">0</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">margin</span>: <span style="color:#ae81ff">0</span> <span style="color:#66d9ef">auto</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">bottom</span>: <span style="color:#ae81ff">260</span><span style="color:#66d9ef">px</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">cursor</span>: <span style="color:#66d9ef">pointer</span>;
|
||||
</span></span><span style="display:flex;"><span> pointer-events: <span style="color:#66d9ef">auto</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">transform-origin</span>: <span style="color:#ae81ff">50</span><span style="color:#66d9ef">%</span> <span style="color:#ae81ff">400</span><span style="color:#66d9ef">px</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">background</span>: <span style="color:#66d9ef">no-repeat</span> <span style="color:#ae81ff">50</span><span style="color:#66d9ef">%</span> <span style="color:#ae81ff">50</span><span style="color:#66d9ef">%</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">background-size</span>: <span style="color:#66d9ef">cover</span>;
|
||||
</span></span><span style="display:flex;"><span>}
|
||||
</span></span><span style="display:flex;"><span>
|
||||
</span></span><span style="display:flex;"><span>.<span style="color:#a6e22e">sakana-box</span> .<span style="color:#a6e22e">sakana-character</span><span style="color:#f92672">[</span><span style="color:#f92672">data-character</span><span style="color:#f92672">=</span><span style="color:#f92672">chisato</span><span style="color:#f92672">]</span> {
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">background-image</span>: url(<span style="color:#e6db74">这里填写自定义摆件图片url</span>)<span style="color:#75715e">!important</span>;
|
||||
</span></span><span style="display:flex;"><span>}
|
||||
</span></span><span style="display:flex;"><span>
|
||||
</span></span><span style="display:flex;"><span>.<span style="color:#a6e22e">sakana-box</span> .<span style="color:#a6e22e">sakana-character</span><span style="color:#f92672">[</span><span style="color:#f92672">data-character</span><span style="color:#f92672">=</span><span style="color:#f92672">takina</span><span style="color:#f92672">]</span> {
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">background-image</span>: url(<span style="color:#e6db74">这里填写自定义摆件图片url</span>)<span style="color:#75715e">!important</span>;
|
||||
</span></span><span style="display:flex;"><span>}
|
||||
</span></span><span style="display:flex;"><span>
|
||||
</span></span><span style="display:flex;"><span>.<span style="color:#a6e22e">sakana-box</span> .<span style="color:#a6e22e">sakana-bed</span> {
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">width</span>: <span style="color:#ae81ff">160</span><span style="color:#66d9ef">px</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">height</span>: <span style="color:#ae81ff">20</span><span style="color:#66d9ef">px</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">position</span>: <span style="color:#66d9ef">absolute</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">left</span>: <span style="color:#ae81ff">0</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">right</span>: <span style="color:#ae81ff">0</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">margin</span>: <span style="color:#ae81ff">0</span> <span style="color:#66d9ef">auto</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">bottom</span>: <span style="color:#ae81ff">0</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">background</span>: rgba(<span style="color:#ae81ff">255</span>, <span style="color:#ae81ff">255</span>, <span style="color:#ae81ff">255</span>, <span style="color:#ae81ff">.5</span>) <span style="color:#66d9ef">no-repeat</span> <span style="color:#ae81ff">50</span><span style="color:#66d9ef">%</span> <span style="color:#ae81ff">50</span><span style="color:#66d9ef">%</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">border-radius</span>: <span style="color:#ae81ff">2</span><span style="color:#66d9ef">px</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">cursor</span>: <span style="color:#66d9ef">pointer</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">background-image</span>: url(<span style="color:#e6db74">data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkAgMAAAANjH3HAAAACVBMVEUAAAAAAAAAAACDY+nAAAAAAnRSTlMAM8lDrC4AAAE2SURBVEjH7dVBjsMwCAVQiyUnGXG0OQXqsqdgif4pJ8YkTh1bnWqkWVRlkVR+BiHiJuUT7x3sKxGsBNBXhQBbiazF58LglXgTnwmi6EToqfBc2IvoKAWat/8Qu0g2JUYoV7EXhf4iD48JiFGKDkIAvA15EMEWmuXFuxAQSbuI9ZSIFEYXAMaAQpvAejGtC9aEugg8Mh1AxbieD7pAANi5HFqTnNLL0X4P0VYk92rKfZP4oSVlb/7uuWVvzZ/LDYPYSmD5nznG4ycR2FwI8BAbhQFUER9F4pGm9JbkkDqOQeAEY+QIu3gtGFJibt+7bCvQIiaeU4YeoiHYhB+EmtxgOZiTWJV7LHyl9ENVL8fO89l1AvwqjAi7SmmiF8kkn761o9hUOFOuUsh+9Q2w14WXQlo+8Z7xAxPfAJiIc7LIAAAAAElFTkSuQmCC</span>);
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">background-size</span>: <span style="color:#ae81ff">20</span><span style="color:#66d9ef">px</span> <span style="color:#ae81ff">20</span><span style="color:#66d9ef">px</span>;
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#66d9ef">box-shadow</span>: <span style="color:#ae81ff">0</span> <span style="color:#ae81ff">0</span> <span style="color:#ae81ff">0</span> <span style="color:#ae81ff">2</span><span style="color:#66d9ef">px</span> rgba(<span style="color:#ae81ff">0</span>, <span style="color:#ae81ff">0</span>, <span style="color:#ae81ff">0</span>, <span style="color:#ae81ff">.05</span>);
|
||||
</span></span><span style="display:flex;"><span>}
|
||||
</span></span><span style="display:flex;"><span>
|
||||
</span></span><span style="display:flex;"><span>.<span style="color:#a6e22e">sakana-box</span><span style="color:#f92672">[</span><span style="color:#f92672">data-can-switch-character</span><span style="color:#f92672">=</span><span style="color:#f92672">true</span><span style="color:#f92672">]</span> .<span style="color:#a6e22e">sakana-bed</span> {
|
||||
</span></span><span style="display:flex;"><span> pointer-events: <span style="color:#66d9ef">auto</span>;
|
||||
</span></span><span style="display:flex;"><span>}
|
||||
</span></span></code></pre></div><p>在footer底部引入js</p>
|
||||
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-js" data-lang="js"><span style="display:flex;"><span><span style="color:#f92672"><</span><span style="color:#a6e22e">script</span> <span style="color:#a6e22e">src</span><span style="color:#f92672">=</span><span style="color:#e6db74">"https://usj.cc/js/sakana.js"</span><span style="color:#f92672">><</span><span style="color:#960050;background-color:#1e0010">/script></span>
|
||||
</span></span></code></pre></div><p>在主题的自定义js进行插件初始化</p>
|
||||
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-js" data-lang="js"><span style="display:flex;"><span> <span style="color:#f92672"><</span><span style="color:#a6e22e">script</span><span style="color:#f92672">></span>
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#a6e22e">Sakana</span>.<span style="color:#a6e22e">setMute</span>(<span style="color:#66d9ef">false</span>);
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#a6e22e">Sakana</span>.<span style="color:#a6e22e">init</span>({
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#a6e22e">el</span><span style="color:#f92672">:</span> <span style="color:#e6db74">'.sakana-box-l'</span>,
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#a6e22e">scale</span><span style="color:#f92672">:</span> .<span style="color:#ae81ff">9</span>,
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#a6e22e">character</span><span style="color:#f92672">:</span><span style="color:#e6db74">'takina'</span>,
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#a6e22e">canSwitchCharacter</span><span style="color:#f92672">:</span> <span style="color:#66d9ef">false</span>,
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#a6e22e">inertia</span><span style="color:#f92672">:</span> <span style="color:#ae81ff">0.001</span>,
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#a6e22e">decay</span><span style="color:#f92672">:</span> <span style="color:#ae81ff">1</span>
|
||||
</span></span><span style="display:flex;"><span> });
|
||||
</span></span><span style="display:flex;"><span><span style="color:#f92672"><</span><span style="color:#960050;background-color:#1e0010">/script></span>
|
||||
</span></span><span style="display:flex;"><span><span style="color:#f92672"><</span><span style="color:#a6e22e">script</span><span style="color:#f92672">></span>
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#a6e22e">Sakana</span>.<span style="color:#a6e22e">setMute</span>(<span style="color:#66d9ef">false</span>);
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#a6e22e">Sakana</span>.<span style="color:#a6e22e">init</span>({
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#a6e22e">el</span><span style="color:#f92672">:</span> <span style="color:#e6db74">'.sakana-box-r'</span>,
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#a6e22e">scale</span><span style="color:#f92672">:</span> .<span style="color:#ae81ff">9</span>,
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#a6e22e">character</span><span style="color:#f92672">:</span><span style="color:#e6db74">'chisato'</span>,
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#a6e22e">canSwitchCharacter</span><span style="color:#f92672">:</span> <span style="color:#66d9ef">false</span>,
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#a6e22e">inertia</span><span style="color:#f92672">:</span> <span style="color:#ae81ff">0.001</span>,
|
||||
</span></span><span style="display:flex;"><span> <span style="color:#a6e22e">decay</span><span style="color:#f92672">:</span> <span style="color:#ae81ff">1</span>
|
||||
</span></span><span style="display:flex;"><span> });
|
||||
</span></span><span style="display:flex;"><span><span style="color:#f92672"><</span><span style="color:#960050;background-color:#1e0010">/script></span>
|
||||
</span></span></code></pre></div><p>在你想展示的位置添加div标签</p>
|
||||
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-html" data-lang="html"><span style="display:flex;"><span><<span style="color:#f92672">div</span> <span style="color:#a6e22e">class</span><span style="color:#f92672">=</span><span style="color:#e6db74">"sakana-box-l sakana-box"</span> <span style="color:#a6e22e">style</span><span style="color:#f92672">=</span><span style="color:#e6db74">"transform: translateY(0px) scale(0.5);"</span>><<span style="color:#f92672">canvas</span> <span style="color:#a6e22e">width</span><span style="color:#f92672">=</span><span style="color:#e6db74">"750"</span> <span style="color:#a6e22e">height</span><span style="color:#f92672">=</span><span style="color:#e6db74">"1200"</span> <span style="color:#a6e22e">style</span><span style="color:#f92672">=</span><span style="color:#e6db74">"width: 500px; height: 800px;"</span>></<span style="color:#f92672">canvas</span>><<span style="color:#f92672">div</span> <span style="color:#a6e22e">class</span><span style="color:#f92672">=</span><span style="color:#e6db74">"sakana-character"</span> <span style="color:#a6e22e">data-character</span><span style="color:#f92672">=</span><span style="color:#e6db74">"takina"</span> <span style="color:#a6e22e">style</span><span style="color:#f92672">=</span><span style="color:#e6db74">"transform: rotate(0.263216deg) translateX(0.263216px) translateY(14.4649px);"</span>></<span style="color:#f92672">div</span>><<span style="color:#f92672">div</span> <span style="color:#a6e22e">class</span><span style="color:#f92672">=</span><span style="color:#e6db74">"sakana-bed"</span>></<span style="color:#f92672">div</span>></<span style="color:#f92672">div</span>>
|
||||
</span></span><span style="display:flex;"><span><<span style="color:#f92672">div</span> <span style="color:#a6e22e">class</span><span style="color:#f92672">=</span><span style="color:#e6db74">"sakana-box-r sakana-box"</span> <span style="color:#a6e22e">style</span><span style="color:#f92672">=</span><span style="color:#e6db74">"transform: translateY(0px) scale(0.5);"</span>><<span style="color:#f92672">canvas</span> <span style="color:#a6e22e">width</span><span style="color:#f92672">=</span><span style="color:#e6db74">"750"</span> <span style="color:#a6e22e">height</span><span style="color:#f92672">=</span><span style="color:#e6db74">"1200"</span> <span style="color:#a6e22e">style</span><span style="color:#f92672">=</span><span style="color:#e6db74">"width: 500px; height: 800px;"</span>></<span style="color:#f92672">canvas</span>><<span style="color:#f92672">div</span> <span style="color:#a6e22e">class</span><span style="color:#f92672">=</span><span style="color:#e6db74">"sakana-character"</span> <span style="color:#a6e22e">data-character</span><span style="color:#f92672">=</span><span style="color:#e6db74">"chisato"</span> <span style="color:#a6e22e">style</span><span style="color:#f92672">=</span><span style="color:#e6db74">"transform: rotate(0.128919deg) translateX(0.128919px) translateY(0.334859px);"</span>></<span style="color:#f92672">div</span>><<span style="color:#f92672">div</span> <span style="color:#a6e22e">class</span><span style="color:#f92672">=</span><span style="color:#e6db74">"sakana-bed"</span>></<span style="color:#f92672">div</span>></<span style="color:#f92672">div</span>>
|
||||
</span></span></code></pre></div><p>大功告成！</p>
|
||||
]]></content:encoded>
|
||||
</item>
|
||||
|
||||
<item>
|
||||
<title>主机配置单</title>
|
||||
<link>https://usj.cc/post/1287/</link>
|
||||
|
||||
Reference in new issue
Block a user