「模板:Layer Arrange/doc」:修訂間差異
跳至導覽
跳至搜尋
小 →描述 |
小 →範例 |
||
(未顯示同一使用者於中間所作的 2 次修訂) | |||
第27行: | 第27行: | ||
* '''基本使用''' | * '''基本使用''' | ||
<pre>{{Layer_Arrange | <pre>{{Layer_Arrange | ||
| {{Color|yellow||第1層 | | {{Color|yellow||第1層 }} | ||
| {{Color|orange|| | | {{Color|orange|| 第2層 }} | ||
| {{Color|red|| | | {{Color|red|| 第3層}} | ||
}}</pre> | }}</pre> | ||
{{Layer_Arrange | {{Layer_Arrange | ||
| {{Color|yellow||第1層 | | {{Color|yellow||第1層 }} | ||
| {{Color|orange|| | | {{Color|orange|| 第2層 }} | ||
| {{Color|red|| | | {{Color|red|| 第3層}} | ||
}} | }} | ||
第60行: | 第60行: | ||
| style=width: 200px; height: 200px; | | style=width: 200px; height: 200px; | ||
}} | }} | ||
* '''圖片疊圖片''' | |||
<pre>{{Layer_Arrange | |||
| [[File:Japari ServalCatFace.jpg|200px]] | |||
| [[File:Japari ServalCatFace.jpg|100px]] | |||
| [[File:Japari ServalCatFace.jpg|50px]] | |||
| style=width: 200px; height: 200px; | |||
}}</pre> | |||
{{Layer_Arrange | |||
| [[File:Japari ServalCatFace.jpg|200px]] | |||
| [[File:Japari ServalCatFace.jpg|100px]] | |||
| [[File:Japari ServalCatFace.jpg|50px]] | |||
| style=width: 200px; height: 200px; | |||
}} | |||
<noinclude>[[category:模板文件]]</noinclude> | <noinclude>[[category:模板文件]]</noinclude> |
於 2023年8月11日 (五) 17:30 的最新修訂
描述
- 一個可以把什麼都疊在一起的模板,目前設計可以疊5層
- 透過CSS的
position
屬性的relative
與absolute
達到疊在一起的效果 - 使用此模板,因為最外圍的div長寬會被視為0,所以內文會被置中,如果不要置中需要在style欄位設定
width
- 目前每一層對齊方式皆以置中為主,之後視狀況加入新要素
語法
{{Gradient Text|方向|顏色|文字}}
欄位 必要性 作用 備註 匿名參數1 必要 第1層 (最底層) 匿名參數2 必要 第2層 匿名參數3 必要 第3層 匿名參數4 必要 第4層 匿名參數5 必要 第5層 (最上層) style 選擇 最外層的自定義樣式 CSS語法
範例
- 基本使用
{{Layer_Arrange | {{Color|yellow||第1層 }} | {{Color|orange|| 第2層 }} | {{Color|red|| 第3層}} }}
第1層
第2層
第3層
- 發光文字疊加
{{Layer_Arrange | {{Glow Text|yellow|'''測試文字'''|scale=1}} | {{Glow Text|orange|'''測試文字'''|scale=0.5|flash=1}} | {{Glow Text|red|'''測試文字'''|scale=0.25}} }}
測試文字
測試文字
測試文字
- 圖片疊文字
{{Layer_Arrange | [[File:Japari ServalCatFace.jpg|200px]] | {{size|18|{{Glow Text|black|''''提 供 '''}}}} | style=width: 200px; height: 200px; }}
- 圖片疊圖片
{{Layer_Arrange | [[File:Japari ServalCatFace.jpg|200px]] | [[File:Japari ServalCatFace.jpg|100px]] | [[File:Japari ServalCatFace.jpg|50px]] | style=width: 200px; height: 200px; }}