|
|
| (161 intermediate revisions by 4 users not shown) |
| Line 1: |
Line 1: |
| <includeonly><table cellspacing="0" cellpadding="0" style="width: 100%; padding: 0; margin: 0; font-size: 1em; line-height: 1.5em; word-break: break-all; border: 1px #000 solid; border-bottom: none; border-sapcing: 0;{{{SectionSty|}}}"> | | __NOTOC__<includeonly><table |
| <tr style="font-weight: bold; color: #fff; text-align: center; vertical-align: middle; text-shadow: 1px 1px 1px black; height: 2em;{{{TitlesStys|}}}">{#if:{{{Title0|}}}| | | style=" |
| <td style="width:{{#if:{{{Width0|}}}|{{{Width0}}}|{{{Width|}}}}}; border-bottom: 1px #000 solid; background-color:{{#if:{{{Color0|}}}|{{{Color0}}}|{{{Color|}}}}}; background-image: linear-gradient(to bottom, #eee, {{#if:{{{Color0|}}}|{{{Color0}}}|{{{Color|}}}}});{{{TitleSty|}}};{{{TitleSty0|}}}" {{{Attr0|}}}>{{{Title0|}}}</td>|}}{{#if:{{{Title1|}}}| | | {{#if:{{{Widths|}}}|width:{{{Widths|}}};}} |
| <td style="width:{{#if:{{{Width1|}}}|{{{Width1}}}|{{{Width|}}}}}; border-bottom: 1px #000 solid; border-left: 1px #000 solid; background-color:{{#if:{{{Color1|}}}|{{{Color1}}}|{{{Color|}}}}}; background-image: linear-gradient(to bottom, #eee, {{#if:{{{Color1|}}}|{{{Color1}}}|{{{Color|}}}}});{{{TitleSty|}}};{{{TitleSty1|}}}" {{{Attr1|}}}>{{{Title1|}}}</td>|}}{{#if:{{{Title2|}}}|
| | {{{SectionSty|}}} |
| <td style="width:{{#if:{{{Width2|}}}|{{{Width2}}}|{{{Width|}}}}}; border-bottom: 1px #000 solid; border-left: 1px #000 solid; background-color:{{#if:{{{Color2|}}}|{{{Color2}}}|{{{Color|}}}}}; background-image: linear-gradient(to bottom, #eee, {{#if:{{{Color2|}}}|{{{Color2}}}|{{{Color|}}}}});{{{TitleSty|}}};{{{TitleSty2|}}}" {{{Attr2|}}}>{{{Title2|}}}</td>|}}{{#if:{{{Title3|}}}| | | " |
| <td style="width:{{#if:{{{Width3|}}}|{{{Width3}}}|{{{Width|}}}}}; border-bottom: 1px #000 solid; border-left: 1px #000 solid; background-color:{{#if:{{{Color3|}}}|{{{Color3}}}|{{{Color|}}}}}; background-image: linear-gradient(to bottom, #eee, {{#if:{{{Color3|}}}|{{{Color3}}}|{{{Color|}}}}});{{{TitleSty|}}};{{{TitleSty3|}}}" {{{Attr3|}}}>{{{Title3|}}}</td>|}}{{#if:{{{Title4|}}}| | | class=" |
| <td style="width:{{#if:{{{Width4|}}}|{{{Width4}}}|{{{Width|}}}}}; border-bottom: 1px #000 solid; border-left: 1px #000 solid; background-color:{{#if:{{{Color4|}}}|{{{Color4}}}|{{{Color|}}}}}; background-image: linear-gradient(to bottom, #eee, {{#if:{{{Color4|}}}|{{{Color4}}}|{{{Color|}}}}});{{{TitleSty|}}};{{{TitleSty4|}}}" {{{Attr4|}}}>{{{Title4|}}}</td>|}}{{#if:{{{Title5|}}}| | | section |
| <td style="width:{{#if:{{{Width5|}}}|{{{Width5}}}|{{{Width|}}}}}; border-bottom: 1px #000 solid; border-left: 1px #000 solid; background-color:{{#if:{{{Color5|}}}|{{{Color5}}}|{{{Color|}}}}}; background-image: linear-gradient(to bottom, #eee, {{#if:{{{Color5|}}}|{{{Color5}}}|{{{Color|}}}}});{{{TitleSty|}}};{{{TitleSty5|}}}" {{{Attr5|}}}>{{{Title5|}}}</td>|}}{{#if:{{{Title6|}}}|
| | {{{SectionCls|}}} |
| <td style="width:{{#if:{{{Width6|}}}|{{{Width6}}}|{{{Width|}}}}}; border-bottom: 1px #000 solid; border-left: 1px #000 solid; background-color:{{#if:{{{Color6|}}}|{{{Color6}}}|{{{Color|}}}}}; background-image: linear-gradient(to bottom, #eee, {{#if:{{{Color6|}}}|{{{Color6}}}|{{{Color|}}}}});{{{TitleSty|}}};{{{TitleSty6|}}}" {{{Attr6|}}}>{{{Title6|}}}</td>|}}{{#if:{{{Title7|}}}|
| | " |
| <td style="width:{{#if:{{{Width7|}}}|{{{Width7}}}|{{{Width|}}}}}; border-bottom: 1px #000 solid; border-left: 1px #000 solid; background-color:{{#if:{{{Color7|}}}|{{{Color7}}}|{{{Color|}}}}}; background-image: linear-gradient(to bottom, #eee, {{#if:{{{Color7|}}}|{{{Color7}}}|{{{Color|}}}}});{{{TitleSty|}}};{{{TitleSty7|}}}" {{{Attr7|}}}>{{{Title7|}}}</td>|}}{{#if:{{{Title8|}}}|
| | {{{Attr|}}} |
| <td style="width:{{#if:{{{Width8|}}}|{{{Width8}}}|{{{Width|}}}}}; border-bottom: 1px #000 solid; border-left: 1px #000 solid; background-color:{{#if:{{{Color8|}}}|{{{Color8}}}|{{{Color|}}}}}; background-image: linear-gradient(to bottom, #eee, {{#if:{{{Color8|}}}|{{{Color8}}}|{{{Color|}}}}});{{{TitleSty|}}};{{{TitleSty8|}}}" {{{Attr8|}}}>{{{Title8|}}}</td>|}}{{#if:{{{Title9|}}}|
| | > |
| <td style="width:{{#if:{{{Width9|}}}|{{{Width9}}}|{{{Width|}}}}}; border-bottom: 1px #000 solid; border-left: 1px #000 solid; background-color:{{#if:{{{Color9|}}}|{{{Color9}}}|{{{Color|}}}}}; background-image: linear-gradient(to bottom, #eee, {{#if:{{{Color9|}}}|{{{Color9}}}|{{{Color|}}}}});{{{TitleSty|}}};{{{TitleSty9|}}}" {{{Attr9|}}}>{{{Title9|}}}</td>|}}{{#if:{{{Title10|}}}|
| | <tr |
| <td style="width:{{#if:{{{Width10|}}}|{{{Width10}}}|{{{Width|}}}}}; border-bottom: 1px #000 solid; border-left: 1px #000 solid; background-color:{{#if:{{{Color10|}}}|{{{Color10}}}|{{{Color|}}}}}; background-image: linear-gradient(to bottom, #eee, {{#if:{{{Color10|}}}|{{{Color10}}}|{{{Color|}}}}});{{{TitleSty|}}};{{{TitleSty10|}}}" {{{Attr10|}}}>{{{Title10|}}}</td>|}}{{#if:{{{Title11|}}}|
| | style="{{{hStyles|}}}" |
| <td style="width:{{#if:{{{Width11|}}}|{{{Width11}}}|{{{Width|}}}}}; border-bottom: 1px #000 solid; border-left: 1px #000 solid; background-color:{{#if:{{{Color11|}}}|{{{Color11}}}|{{{Color|}}}}}; background-image: linear-gradient(to bottom, #eee, {{#if:{{{Color11|}}}|{{{Color11}}}|{{{Color|}}}}});{{{TitleSty|}}};{{{TitleSty11|}}}" {{{Attr11|}}}>{{{Title11|}}}</td>|}}{{#if:{{{Title12|}}}|
| | class=" |
| <td style="width:{{#if:{{{Width12|}}}|{{{Width12}}}|{{{Width|}}}}}; border-bottom: 1px #000 solid; border-left: 1px #000 solid; background-color:{{#if:{{{Color12|}}}|{{{Color12}}}|{{{Color|}}}}}; background-image: linear-gradient(to bottom, #eee, {{#if:{{{Color12|}}}|{{{Color12}}}|{{{Color|}}}}});{{{TitleSty|}}};{{{TitleSty12|}}}" {{{Attr12|}}}>{{{Title12|}}}</td>|}}{{#if:{{{Title13|}}}|
| | textfloat |
| <td style="width:{{#if:{{{Width13|}}}|{{{Width13}}}|{{{Width|}}}}}; border-bottom: 1px #000 solid; border-left: 1px #000 solid; background-color:{{#if:{{{Color13|}}}|{{{Color13}}}|{{{Color|}}}}}; background-image: linear-gradient(to bottom, #eee, {{#if:{{{Color13|}}}|{{{Color13}}}|{{{Color|}}}}});{{{TitleSty|}}};{{{TitleSty13|}}}" {{{Attr13|}}}>{{{Title13|}}}</td>|}}{{#if:{{{Title14|}}}|
| | {{{hClses|}}} |
| <td style="width:{{#if:{{{Width14|}}}|{{{Width14}}}|{{{Width|}}}}}; border-bottom: 1px #000 solid; border-left: 1px #000 solid; background-color:{{#if:{{{Color14|}}}|{{{Color14}}}|{{{Color|}}}}}; background-image: linear-gradient(to bottom, #eee, {{#if:{{{Color14|}}}|{{{Color14}}}|{{{Color|}}}}});{{{TitleSty|}}};{{{TitleSty14|}}}" {{{Attr14|}}}>{{{Title14|}}}</td>|}}{{#if:{{{Title15|}}}|
| | {{#ifeq:{{{Color|}}}|Rainbow|rainbow}} |
| <td style="width:{{#if:{{{Width15|}}}|{{{Width15}}}|{{{Width|}}}}}; border-bottom: 1px #000 solid; border-left: 1px #000 solid; background-color:{{#if:{{{Color15|}}}|{{{Color15}}}|{{{Color|}}}}}; background-image: linear-gradient(to bottom, #eee, {{#if:{{{Color15|}}}|{{{Color15}}}|{{{Color|}}}}});{{{TitleSty|}}};{{{TitleSty15|}}}" {{{Attr15|}}}>{{{Title15|}}}</td>|}} | | "> |
| | {{#forargs:Title |
| | | key |
| | | value |
| | | {{#if:{{#var:value|}} |
| | |<th |
| | style=" |
| | {{#if:{{{Width|}}}|width:{{{Width}}};}} |
| | {{#if:{{{Width{{#var:key|}}|}}}|width:{{{Width{{#var:key|}}}}};}} |
| | {{#if:{{{Color|}}}|background-color:{{{Color}}};}} |
| | {{#if:{{{Color{{#var:key|}}|}}}|background-color:{{{Color{{#var:key|}}}}};}} |
| | {{{hStyle|}}}; |
| | {{{hStyle{{#var:key|}}|}}} |
| | " |
| | class=" |
| | {{{hCls{{#var:key|}}|{{{hCls|}}}}}} |
| | {{#ifeq:{{{Color{{#var:key|}}|}}}|Rainbow|rainbow}} |
| | " |
| | {{{hAttr{{#var:key|}}|{{{hAttr|}}}}}} |
| | ><!-- |
| | -->{{#if:{{{header|}}} |
| | |<h{{{header|}}} id="{{anchorencode:{{#var:value|}}}}">{{#var:value|}}</h{{{header|}}}> |
| | |{{#var:value|}} |
| | }}<!-- |
| | --></th> |
| | }} |
| | }} |
| </tr> | | </tr> |
| <tr style="vertical-align: top;{{{Styles|}}}">{{#if:{{{Title0|}}}| | | <tr |
| <td style="padding: 0.5em;{{{Style|}}};{{{Style0|}}}">{{{Content0|}}}</td>|}}{{#if:{{{Title1|}}}| | | style="{{{Styles|}}}" |
| <td style="padding: 0.5em;{{{Style|}}};{{{Style1|}}}">{{{Content1|}}}</td>|}}{{#if:{{{Title2|}}}|
| | class="{{{Clses|}}}" |
| <td style="padding: 0.5em;{{{Style|}}};{{{Style2|}}}">{{{Content2|}}}</td>|}}{{#if:{{{Title3|}}}|
| | > |
| <td style="padding: 0.5em;{{{Style|}}};{{{Style3|}}}">{{{Content3|}}}</td>|}}{{#if:{{{Title4|}}}|
| | {{#forargs:Title |
| <td style="padding: 0.5em;{{{Style|}}};{{{Style4|}}}">{{{Content4|}}}</td>|}}{{#if:{{{Title5|}}}|
| | | key |
| <td style="padding: 0.5em;{{{Style|}}};{{{Style5|}}}">{{{Content5|}}}</td>|}}{{#if:{{{Title6|}}}|
| | | value |
| <td style="padding: 0.5em;{{{Style|}}};{{{Style6|}}}">{{{Content6|}}}</td>|}}{{#if:{{{Title7|}}}|
| | | {{#if:{{#var:value|}} |
| <td style="padding: 0.5em;{{{Style|}}};{{{Style7|}}}">{{{Content7|}}}</td>|}}{{#if:{{{Title8|}}}|
| | |<td |
| <td style="padding: 0.5em;{{{Style|}}};{{{Style8|}}}">{{{Content8|}}}</td>|}}{{#if:{{{Title9|}}}|
| | style=" |
| <td style="padding: 0.5em;{{{Style|}}};{{{Style9|}}}">{{{Content9|}}}</td>|}}{{#if:{{{Title10|}}}|
| | {{#if:{{{Width|}}}|width:{{{Width}}};}} |
| <td style="padding: 0.5em;{{{Style|}}};{{{Style10|}}}">{{{Content10|}}}</td>|}}{{#if:{{{Title11|}}}|
| | {{#if:{{{Width{{#var:key|}}|}}}|width:{{{Width{{#var:key|}}}}};}} |
| <td style="padding: 0.5em;{{{Style|}}};{{{Style11|}}}">{{{Content11|}}}</td>|}}{{#if:{{{Title12|}}}|
| | {{{Style|}}}; |
| <td style="padding: 0.5em;{{{Style|}}};{{{Style12|}}}">{{{Content12|}}}</td>|}}{{#if:{{{Title13|}}}|
| | {{{Style{{#var:key|}}|}}} |
| <td style="padding: 0.5em;{{{Style|}}};{{{Style13|}}}">{{{Content13|}}}</td>|}}{{#if:{{{Title14|}}}|
| | " |
| <td style="padding: 0.5em;{{{Style|}}};{{{Style14|}}}">{{{Content14|}}}</td>|}}{{#if:{{{Title15|}}}|
| | class="{{{Cls{{#var:key|}}|{{{Cls|}}}}}}" |
| <td style="padding: 0.5em;{{{Style|}}};{{{Style15|}}}">{{{Content15|}}}</td>|}} | | {{{Attr{{#var:key|}}|{{{Attr|}}}}}} |
| | ><!-- |
| | -->{{{Content{{#var:key|}}|}}}<!-- |
| | --></td> |
| | }} |
| | }} |
| </tr> | | </tr> |
| </table></includeonly> | | </table><includeonly><noinclude>{{Doc}}</noinclude> |
| <noinclude>{{DISPLAYTITLE:Section模板}}<span class="tochidden"></span> | |
| == Section模板 ==
| |
| Section模板是由[[User:boxsnake|boxsnake]]编写的UI模板，旨在美化界面。
| |
| == 模板参数 ==
| |
| *'''什么是模板参数？'''
| |
| 模板参数可以看做是传入模板的变量，由模板接受后填入对应的代码位置，一般为'''''<nowiki>参数名=参数值</nowiki>'''或者'''或者'''''参数值'''''。如果用前者方式传入模板，模板通过变量名调用变量的值（比如'''''a=2'''''，那么模板调用a就会显示2），后者传入模板的话，模板根据传入值的序列用序列号调用（第一个序号为1，第二个为2，依次类推）。
| |
| *'''我如何传入模板参数？'''
| |
| <nowiki>{{模板名
| |
| | 参数1
| |
| | 参数名2=参数值2
| |
| }}</nowiki>
| |
| *模板参数使用“|”分割。
| |
| === 整体参数 ===
| |
| ==== StyleSec ====
| |
| *此参数用于为整个Section框架增加样式，样式写法兼容CSS语句。并且，此样式会覆盖之前已有的同名样式。
| |
| ==== StyleTitle ====
| |
| *此参数用于为整个Section表头增加样式，样式写法兼容CSS语句。并且，此样式会覆盖之前已有的同名样式。
| |
| ==== StyleContent ====
| |
| *此参数用于为整个Section内容区增加样式，样写法兼容CSS语句。并且，此样式会覆盖之前已有的同名样式。
| |
| === 个体参数 ===
| |
| *Section模板可以由多列组成，每个列在此维基页中称为''“个体”''。一个Section模板最多可以拥有16个个体（列）。
| |
| *只要有个体对应的标题参数存在且不为空值，个体就会在Section中显示。
| |
| ==== Title ====
| |
| *标题参数（即显示在Section头部的文字），参数名依次为'''Title、Title1、Title2、...、Title15'''（最多16个）。
| |
| ==== Content ====
| |
| *内容参数，参数名称为'''Content'''到'''Content15'''（规则同'''Title'''参数）。对应个体的内容。
| |
| ==== Width ====
| |
| *宽度参数，参数名称为'''Width'''到'''Width15'''（规则同'''Title'''参数）。指定对应个体的宽度，可以使用em，pt等，也可以使用百分比，不需要在末尾添加分号。如果不指定将由浏览器自动调整。
| |
| ==== Color ====
| |
| *颜色参数，参数名称为'''Color'''到'''Color15'''（规则同'''Title'''参数）。指定对应个体标签部分的背景颜色。可以使用rgba函数，以#开头的颜色值，或者是CSS颜色值（如red，white等）。注意，颜色后不要添加分号。
| |
| ==== StyleT ====
| |
| *标题附加样式，参数名称为'''StyleT'''到'''StyleT15'''（T的意思为Title，规则同'''Title'''参数）。作用类似整体参数'''StyleSec'''、'''StyleTitle'''和'''StyleContent'''，给对应的个体标题附加样式。样式写法兼容CSS语句。并且，此样式会覆盖之前已有的同名样式，以及'''StyleSec'''和'''StyleTitle'''中定义的相同样式。
| |
| ==== Style ====
| |
| *内容附加样式，参数名称为'''Style'''到'''Style15'''（规则同'''Title'''参数）。对应个体内容区域的附加样式，作用和'''StyleT'''类似。
| |
| ==== Attr ====
| |
| *首元素附加属性。此参数设置首元素（也就是'''Title'''对应的个体），可以为其添加类似colspan和rowspan之类的属性。
| |
| == 其他注意事项和提示 ==
| |
| *为了Section之间的接合，默认情况下，Section是没有底边的。如果需要请进行StyleSec调整。
| |
| *如果为Section设置了圆角，注意同时要调整标题和底部样式，否则对应区域可能会超出Section边框。
| |
| *标题底部的黑色线条为个体标题的样式（'''StyleT'''），而非标题的整体样式。
| |
| *从'''Title1'''对应个体开始，左侧有黑色边框，为了和之前的个体接合。如果需要跳过'''Title'''表示的个体，将其他个体作为首个个体，记得要将左侧边框去掉。
| |
| *标题参数存在但为空不会显示对应个体，所以如果需要空标题的个体，请在标题处使用空白对象或者不可见元素。
| |
| *对于某些内容，在等号之后输入会发生错误，需要在内容外加上<code><nowiki><span style="display: none">{{</span></nowiki></code>和<code><nowiki><span style="display: none">}}</span></nowiki></code>。
| |
| *内容区域之间默认是没有黑线的，如果需要黑线请使用'''Style'''参数。
| |
| *由于个体宽度是由标题宽度决定的，所以当隐藏标题后，应该设置内容样式而不是使用Width参数。
| |
| == 示例 ==
| |
| {{Section
| |
| | StyleTitle=background-color: red;
| |
| | StyleContent=background-color: lightblue;
| |
| | Title=Section
| |
| | Content=Content
| |
| | Color=black
| |
| | Width=20%
| |
| | Title1=Section1
| |
| | Content1=Content1
| |
| }}
| |
| 代码如下：
| |
| <code><pre>{{Section
| |
| | StyleTitle=background-color: red;
| |
| | StyleContent=background-color: lightblue;
| |
| | Title=Section
| |
| | Content=Content
| |
| | Color=black
| |
| | Width=20%
| |
| | Title1=Section1
| |
| | Content=Content1
| |
| }}</pre></code></noinclude>
| |
