帮助:折叠显示

可折叠元素包含一个切换按钮,读者可以使用它来显示或隐藏元素的内容。通过添加类值mw-collapsible,或者使用模板{{Collapse}}或其变体{{Collapse top}}{{Collapse bottom}},可以使元素可折叠。

在条目中使用这些功能受Wikipedia:格式手册 § 滚动列表与折叠元素的约束,更具体说是受Wikipedia:隐藏元素Wikipedia:剧透内容的约束。

可折叠表格

编辑

mw-collapsible类可使任意元素可折叠,但使表格可折叠尤为简单。将mw-collapsible类添加到表格中会自动定位切换按钮,并选择要折叠的部分。

一种常见用途是制作一个可折叠的布局表格,它始终显示简介或摘要,但隐藏其余内容,不让用户直接看到。简介或摘要位于第一行,内容位于后续行,使用“展开”按钮即可轻松访问其内容。

在下面的示例中,wikitable类的使用仅仅是为了外观,它不是让mw-collapsible起作用所必须的。

输入代码 输出内容
{| role="presentation" class="wikitable mw-collapsible"
| <strong>千字文</strong>
|-
| 天地玄黄,宇宙洪荒。日月盈昃,辰宿列张。
|}

更复杂的数据表格也可以折叠。

输入代码 输出内容
{| class="wikitable mw-collapsible"
|+ class="nowrap" | 冬季奥林匹克运动会
|-
|
! scope="col" | 国家/地区
! scope="col" | 城市
|-
! scope="row" | 1994年
| 挪威 || 利勒哈默尔
|-
! scope="row" | 1998年
| 日本 || 长野
|}
冬季奥林匹克运动会
国家/地区 城市
1994年 挪威 利勒哈默尔
1998年 日本 长野

默认折叠

编辑

仅使用mw-collapsible类会使元素默认展开,但读者可以将其折叠。也可以通过随mw-collapsible添加其他类使元素默认折叠并可选择展开。有以下方法可以执行此操作,具体取决于用户希望元素折叠的情况。但是,根据MOS:DONTHIDE,内容不应默认折叠。

"mw-collapsed"

编辑

添加类值mw-collapsed将使元素始终处于初始折叠状态,无论其周围发生什么,这是最简单的方法。使用上述示例:

输入代码 输出内容
{| role="presentation" class="wikitable mw-collapsible mw-collapsed"
| <strong>千字文</strong>
|-
| 天地玄黄,宇宙洪荒。日月盈昃,辰宿列张。
|}
{| class="wikitable mw-collapsible mw-collapsed"
|+ class="nowrap" | 冬季奥林匹克运动会
|-
|
! scope="col" | 国家/地区
! scope="col" | 城市
|-
! scope="row" | 1994年
| 挪威 || 利勒哈默尔
|-
! scope="row" | 1998年
| 日本 || 长野
|}
冬季奥林匹克运动会
国家/地区 城市
1994年 挪威 利勒哈默尔
1998年 日本 长野

"autocollapse"

编辑

如果页面上有一个以上可折叠元素,则添加类值autocollapse会使元素折叠。所以,下面的示例会折叠,因为该页面包含许多可折叠元素。

输入代码 输出内容
{| role="presentation" class="wikitable mw-collapsible autocollapse"
| <strong>千字文</strong>
|-
| 天地玄黄,宇宙洪荒。日月盈昃,辰宿列张。
|}

"innercollapse"和"outercollapse"

编辑

使用这对类,可以使元素仅在包含在特定的外部元素中时才默认折叠。如果一个具有mw-collapsibleinnercollapse类的元素包含在具有outercollapse类的元素中,则该元素会默认折叠;反之,则默认不会折叠该元素。这主要用于模板中,因为模板是嵌入包含的。

输入代码 输出内容
{| role="presentation" class="wikitable mw-collapsible innercollapse"
|<code>innercollapse</code>元素
|-
| 默认'''未折叠'''
|}

<div class="wikitable outercollapse" style="padding:1em; background:#ccc;">
这是一个具有<code>outercollapse</code>类的元素

{| role="presentation" class="wikitable mw-collapsible innercollapse"
|<code>innercollapse</code>元素
|-
| 默认'''折叠'''
|}
</div>

这是一个具有outercollapse类的元素

其他说明

编辑

带标题的表格

编辑

没有标题的表格将折叠到第一行。有标题的表格将折叠到其标题,没有行,所以没有宽度。使用class="nowrap"{{nowrap}}可防止标题在表格折叠时被挤压到垂直列中。

输入代码 输出内容
{|class="wikitable sortable mw-collapsible" 
|+ class="nowrap" | 有点长的表格标题
! 姓名 !! 分数
|-
| 张三 || 59
|-
| 李四 || 72
|}
有点长的表格标题
姓名 分数
张三 59
李四 72

下面的示例使用{{nowrap}}并以末尾括号作为换行点,<style=max-width:Xem;将不起作用。

输入代码 输出内容
{|class="wikitable sortable mw-collapsible" 
|+ {{nowrap|较长的表格标题需要换行}}适用于移动设备
! 姓名 !! 分数
|-
| 张三 || 59
|-
| 李四 || 72
|}
较长的表格标题需要换行适用于移动设备
姓名 分数
张三 59
李四 72

可排序表格

编辑

可折叠表格可以毫无困难地与可排序表格功能结合使用。但是,由于展开/折叠按钮位于mw-collapsible第一行最右侧的单元格中,如果单元格不够宽,其定位可能看起来有点奇怪:

输入代码 输出内容
{|class="wikitable mw-collapsible sortable" style="width:5em"
<!--表格宽度太窄,这是有意而为之-->
|-
! 姓名 !! 分数
|-
| 张三 || 59
|-
| 李四 || 72
|}
姓名 分数
张三 59
李四 72

一个可用的替代方案是在表格上方添加标题,参见下面的示例:

输入代码 输出内容
{|class="wikitable sortable mw-collapsible" 
|+ class="nowrap" | 标题 
! 姓名 !! 分数
|-
| 张三 || 59
|-
| 李四 || 72
|}
标题
姓名 分数
张三 59
李四 72

技术限制

编辑
  • 此功能要求最终用户的浏览器启用JavaScript。如果禁用JavaScript,则默认行为是显示内容。

参见

编辑

文档:

模板:

外部链接

编辑