用戶:KomacyaN/代碼存儲

{{subst:標題替換|Komari醬的儲藏室}} {{subst:用戶 允許他人編輯}} {{subst:隱藏目錄}}

跳轉至頁面底端

來自 摺紙本命

解釋

一個可以用於跳轉至頁面底端的按鈕，多用於討論頁。

效果

Template:按鈕

Template:按鈕

---

<center><div class="nomobile" style="display:inline-block">{{按钮|#footer|底端}}</div><div class="mobileonly" style="display:inline-block">{{按钮|#mw-mf-display-toggle|底端}}</div></center>

---

用戶框相關

來自 MJH

解釋

一個可以讓用戶框變整齊的代碼。

效果

---

---

{| class="floatleft vcard" style="margin-left: 1em; margin-bottom: 0.5em; max-width: 242px; border: navy solid 1px; background-color: #FFFFFF"
|- 
|style = "text-align:center"|说明文字
<div style="text-align:left">
（在这里放用户框
</div>
|}

---

來自 飯裡撲

效果

Template:用戶 新手Template:用戶 本命Template:用戶 碧藍航線

解釋

一個讓用戶框變整齊的代碼，且有動態效果。
需要您創建一個內容模型為「純CSS」的頁面。
複製下方標註為"CSS"的代碼並點擊這裏創建頁面→Special:Mypage/CSS/style.css
創建頁面後打開Special:ChangeContentModel，輸入頁面名，然後將【新的內容模型】設置為「已過濾的CSS」即可。

---

創建"Special:Mypage/CSS/style.css"時所需要的代碼: Template:Pre

---

在用戶頁/其他頁面使用時:

" />
<span style="padding: 10px;"><span class="hvr-grow-shadow">{{subst:用户 新手|请多多关照}}</span></span><!--
--><span style="padding: 10px;"><span class="hvr-grow-shadow">{{subst:用户_本命|越谷小鞠|[[File:越谷小鞠.png|40px]]}}</span></span><!--
--><span style="padding: 10px;"><span class="hvr-grow-shadow">{{subst:用户_碧蓝航线|锉刀~锉~锉~锉~}}</span></span><!---->

---

來自 九江月

效果

※：因頁面排版原因僅展示了部分內容。{{subst:jk|其實就是技術力不足。}}

解釋

鼠標移至上面改變樣式。{{hover}}

---

<div style="width:60px;height:20px;padding-left:5px;background-color:#666666;border-right:5px solid #ccaa66;border-left:1px solid #fff;color:#eee">资料卡</div>
    <div style="display:inline-block;width:calc(150% - 12px);height:100%;">
      <div style="display:inline-block;max-width:250px;width:100%;min-width:100px;height:60px;background-color:#ffbbcc;border:1px solid grey;position:relative;">
        <div style="display:inline-block;width:50px;height:60px;background-color:#fff;">
{{hover|before=
          <p style="margin:0;padding:12px 0;line-height:100%;color:#ffbbcc;font-size:1.2em;font-weight:600;text-shadow: 1px 1px 0 #ddd;font-family:'Microsoft YaHei';text-align:center;">卖萌专业</p>
          <div style="display:inline-block;width:180px;color:#fff;position:absolute;top:30%;left:60px;"><span style="margin:0;padding:0;color:#fff;">这名用户致力于卖萌学。</span></div>
|after=
          <p style="margin:0;padding:12px 0;line-height:100%;color:#ffbbcc;font-size:1.2em;font-weight:600;text-shadow: 1px 1px 0 #ddd;font-family:'Microsoft YaHei';text-align:center;">无尺之徒</p>
          <div style="display:inline-block;width:180px;color:#fff;position:absolute;top:30%;left:60px;"><span style="margin:0;padding:0;color:#fff;">这名用户不使用量角器。</span></div>
}}
        </div>
      </div>
      <div style="display:inline-block;max-width:250px;width:100%;min-width:100px;height:60px;background-color:#ffbbcc;border:1px solid grey;position:relative;">
        <div style="display:inline-block;width:50px;height:60px;background-color:#fff;">
{{hover|before=
          <p style="margin:0;padding:12px 0;line-height:100%;color:#ffbbcc;font-size:1.2em;font-weight:600;text-shadow: 1px 1px 0 #ddd;font-family:'Microsoft YaHei';text-align:center;">兴趣广泛</p>
          <div style="display:inline-block;width:180px;color:#fff;position:absolute;top:30%;left:60px;"><span style="margin:0;padding:0;color:#fff;">这名用户不是只会卖萌。</span></div>
|after=
          <p style="margin:0;padding:12px 0;line-height:100%;color:#ffbbcc;font-size:1.2em;font-weight:600;text-shadow: 1px 1px 0 #ddd;font-family:'Microsoft YaHei';text-align:center;">我要哭了</p>
          <div style="display:inline-block;width:180px;color:#fff;position:absolute;top:30%;left:60px;"><span style="margin:0;padding:0;color:#fff;">这名用户其实只会卖萌。</span></div>
}}
        </div>
      </div>
      <div style="display:inline-block;max-width:250px;width:100%;min-width:100px;height:60px;background-color:#ffbbcc;border:1px solid grey;position:relative;">
        <div style="display:inline-block;width:50px;height:60px;background-color:#fff;overflow:hidden;">
          <p style="margin:0;padding:12px 0;line-height:100%;color:#ffbbcc;font-size:1.2em;font-weight:600;text-shadow: 1px 1px 0 #ddd;font-family:'Microsoft YaHei';text-align:center;">真萌组</p>
          <div style="display:inline-block;width:calc(100% - 50px);color:#fff;position:absolute;top:30%;left:60px;"><span style="margin:0;padding:0;color:#fff;">这名用户是  <b style="color:#e97b91;">真萌组</b>  成员。</span></div>
        </div>
      </div>
      <div style="display:inline-block;max-width:250px;width:100%;min-width:100px;height:60px;background-color:#ffbbcc;border:1px solid grey;position:relative;">
        <div style="display:inline-block;width:50px;height:60px;background-color:#fff;overflow:hidden;">
          <p style="margin:0;padding:5px 0 5px 0px;line-height:100%;color:#ffbbcc;font-size:1.4em;font-weight:600;text-shadow: 1px 1px 0 #ddd;font-family:'Microsoft YaHei';text-align:center;">[[File:Gokou_Ruri_by_倉澤もこ.png|40px]]</p>
          <div style="display:inline-block;width:calc(100% - 50px);color:#fff;position:absolute;top:30%;left:60px;"><span style="margin:0;padding:0;color:#fff;text-align:center;">这名用户是  <b style="color:#666666;">猫</b><b style="color:#ccaa66;">耳</b><b style="color:#eeeeee;">控</b>。</span></div>
        </div>
      </div>
      <div style="display:inline-block;max-width:250px;width:100%;min-width:100px;height:60px;background-color:#000;border:1px solid grey;position:relative;">
        <div style="display:inline-block;width:50px;height:60px;background-color:#fff;">
{{hover|before=
          <p style="margin:0;padding:12px 0;line-height:100%;color:#000;font-size:1.2em;font-weight:600;text-shadow: 1px 1px 0 #ddd;font-family:'Microsoft YaHei';text-align:center;">拒绝交易</p>
          <div style="display:inline-block;width:180px;color:#fff;position:absolute;top:30%;left:60px;"><b style="margin:0;padding:0;color:#fff;">这名用户坚决不买萌。</b></div>
|after=
          <p style="margin:0;padding:12px 0;line-height:100%;color:#000;font-size:1.2em;font-weight:600;text-shadow: 1px 1px 0 #ddd;font-family:'Microsoft YaHei';text-align:center;">标准傲娇</p>
          <div style="display:inline-block;width:180px;color:#fff;position:absolute;top:30%;left:60px;"><b style="margin:0;padding:0;color:#fff;">哼哒，才不买你们的萌呢！</b></div>
}}
</div>

---

九江月前輩有關圖形的子頁面：User:九江月/圖形‎

計算相關

來自 九江月

解析

是一個計算器，異或計算的。 Template:Pre

---

時鐘效果

來自 九江月

效果

Template:M-animation Template:ICounterTemplate:ICounterTemplate:ICounterTemplate:ICounterTemplate:ICounterTemplate:ICounterTemplate:ICounter

Template:Image

解釋

css動畫。
以下為九江月前輩原話：
「不需要js依賴系統緩存的時間存在一定的滯後性」
「但能運行一天」

---

搜索框

來自 摺紙本命

解釋

似乎是一個快速創建沙盒的輸入框。和一個站內搜索框。也有編輯某個頁面的「按鈕」。只需要將"User:平平凡凡小小鞠"改為對應頁面即可。help:使用插件#inputbox

效果

用戶

模板

幫助

分類

討論

---

<inputbox>
type=search
width=29
buttonlabel=search
break=no
namespaces=用户,萌娘百科,模板,帮助,分类,讨论
prefix=
</inputbox>
<inputbox>
type=create
buttonlabel=创建沙盒
prefix=Special:Mypage/
width=29
break=no
</inputbox>
<inputbox>
break=no
type=create
buttonlabel=编辑
default=User:平平凡凡小小鞠
width=29
</inputbox>

---

隱藏討論串

來自 胡祥又

解釋

用於隱藏討論串的代碼。

---

{{#vardefine:hideid|-1}}{{ptl|define=hidebegin|tl={{#widget:toggle}}<div class="plainlinks mw-customtoggle-{{#var:hideid}} saveNotice" style="cursor: pointer; font-size: 12px; background-color: #E1EEFF; border: 1px solid #E1E1E1; border-radius: 10px 10px 0 0; text-align: center; color: #838383;">▼此討論串已被隱藏。點擊展開。</div><div class="mw-collapsible mw-collapsed" id="mw-customcollapsible-{{#var:hideid}}" style="border: 1px solid #E1E1E1; border-radius: 0 0 10px 10px; padding: 0.2em;">{{#vardefine:hideid|{{#expr:{{#var:hideid}}+1}}}}{{{1|}}}</div>}}
{{ptl|1=<!--需要隱藏的討論串-->}}

---

頁面排版

效果

左

中

右

解釋

使文字分別顯示在「left（左）」、「center（中）」、「right（右）」。

---

<div align="  ">文字</div>

---

{{#Widget:SideBarPic}}

<img data-src="穹妹壁紙.png"

style="position:fixed; top:0; width:100%; height:100%; object-fit:cover; object-position:center center; animation:show 2s; "

/>