模板:Collapse:修订间差异
来自星露谷物语扩展百科
更多语言
更多操作
分离文档 |
新版 Collapse 测试 |
||
| 第1行: | 第1行: | ||
<includeonly>{{Clear|left}}{{#if:{{#varexists: | <includeonly>{{Clear|left}}{{#if:{{#varexists:sizau_collapse_css}}||{{#vardefineecho:sizau_collapse_css|{{#css:.sizau-collapse-text:before{content:"显示"}.sizau-collapse-text.collapsed:before{content:"显示"}.sizau-collapse-text:not(.collapsed):before{content:"隐藏"}.sizau-btn-collapse{color:#0645ad;cursor:pointer}.sizau-btn-collapse:hover{color:#23527c}.sizau-collapse-left:before{content:" ["}.sizau-collapse-right:before{content:"]"}.sizau-btn-collapse{padding:unset;font-size:14px;border:none;line-height:normal;vertical-align:unset}.mw-parser-output p:has(+div.sizau-collapse){margin-top:2px;margin-bottom:2px} }}}}}}{{#vardefine:collapse_count|{{#expr:{{#var:collapse_count|0}}+1}}}}'''{{{1|详情}}}'''<span class="sizau-collapse-left"></span><span type="button" class="sizau-collapse-text sizau-btn-collapse collapsed" data-sizau-toggle="collapse" data-sizau-target="#collapse{{#var:collapse_count}}" style="{{{css|}}}"></span><span class="sizau-collapse-right"></span> | ||
<div id="collapse{{#var:collapse_count}}" class=" | <div id="collapse{{#var:collapse_count}}" class="sizau-collapse" style="height: 0px;"> | ||
{{{content|}}} | {{{content|}}} | ||
</div></includeonly><noinclude>{{Documentation}}</noinclude> | </div></includeonly><noinclude>{{Documentation}}</noinclude> | ||
2025年7月24日 (四) 19:26的版本
本模板用于创建一个默认折叠的,可展开的元素。一般情况下可用于防止剧透、折叠进阶内容等。
参数
参数一为标题,未填写时默认为“详情”;参数 content(或参数二)为收起的内容(不需要保留新空行)。
示例
===紫色花===
{{Collapse|答案|content=一共有 22 朵紫色花。完成后奖励1个[[木头]]。<ref>这是一条引文测试。</ref>}}
===紫色海星===
{{Collapse|答案|content=一共有 18 个紫色海星。完成后奖励1个[[木头]]。<ref>这是另一条引文测试。</ref>}}
===引文测试===
<references/>
紫色花
答案
一共有 22 朵紫色花。完成后奖励1个木头。[1]
紫色海星
答案
一共有 18 个紫色海星。完成后奖励1个木头。[2]
引文测试
说明
该模板作用与下方的 wikitable 示例类似,但展示效果略有不同,并且支持锚点、文本搜索自动定位的特性,并且在响应式(兼容不同的屏幕尺寸)上表现更好。
{|class="mw-collapsible mw-collapsed"
! style="text-align: left;" | '''标题'''
|-
|
折叠起来的内容。如果内容比较长的话,展开和收起的按钮会到处乱跑。
|-
|}
| 标题 |
|---|
|
折叠起来的内容。如果内容比较长的话,展开和收起的按钮会到处乱跑。 |
本模板的折叠功能基于 HTML 标签 <details> 和 <summary> 实现,该方案不依赖 Javascript,总体效果更加稳定。
对于 Chromium 系的浏览器,浏览器自带的文本搜索功能能够直接搜索和定位被折叠的内容;引文等锚点也能自动定位。定位后会自动将对应的折叠进行展开。(Firefox 和 Safari 不支持相关特性)
[ 查看 | 编辑 | 历史 | 刷新 ]上述文档的内容来自模板:Collapse/doc。