FANDOM


目前本功能暫時在手機版面不支援,之推出相關功能,參見手機版面最佳實踐

摺疊(Collapsing)是一個用來摺疊(或隱藏)任何HTML組成部分的功能。

很多時候一個頁面可能包含許多相關的內容,使頁面過長,使用摺疊的功能可以讓頁面縮短,讓感興趣的讀者自己打開內容。除了表格之外,其他wiki頁面的部分也可以設計摺疊。

要使用摺疊功能,只需使用 "mw-collapsible" 的語法。

摺疊表格

將"mw-collapsible"設定為class,可以摺疊一個表格以節省空間。(輸入左圖語法,顯示為右圖)

標題
数字 字母
1 A
2 B
3 C
{| class="article-table mw-collapsible" style="float:right"
|+標題
! 数字 !! 字母
|-
| 1 || A
|-
| 2 || B
|-
| 3 || C
|}

局部摺疊表格內容

將表格中的某儲存格內容摺疊,需要用上一點點的HTML代碼,這個可說是其不足之處。

X Y Z
下面內容默認隱藏 35 91
我是摺疊的內容 42 63
<table class="wikitable" style="float:right;">
<tr>
<th>X</th> 
<th>Y</th> 
<th>Z</th>
</tr>
<tr>
<td>下面內容默認隱藏</td> 
<td>35</td> 
<td>91</td>
</tr>
<tr>
<td class="mw-collapsible mw-collapsed">我是摺疊的內容</td> 
<td>42</td> 
<td>63</td>
</tr>
</table>

摺疊文字

可以在一篇文章中摺疊文字以減短頁面,並讓想要看的讀者自己打開其他的部分。

<div class="mw-collapsible">
這個文字可以摺疊。
</div>

顯示為:

這個文字可以摺疊。

進階設定

預設狀態

要將預設狀態設定為摺疊, 在"mw-collapsible"之外加上"mw-collapsed" ,如同下面表格所見:

{| class="mw-collapsible mw-collapsed wikitable"
! 這個頂部 || 是看得到的
|-
| 這個內容 || 會在第一次
|-
| 載入時 || 隱藏
|}
這個頂部 是看得到的
這個內容 會在第一次
載入時 隱藏

選擇可摺疊的內容

你也可以使用"mw-collapsible-content"來指定那個部分是可以摺疊的。

<div class="mw-collapsible mw-collapsed" style="width:100%">
這段文字不能摺疊,但下一段可以摺疊且預設隱藏:
<div class="mw-collapsible-content">這段文字預設為隱藏。</div>
這段文字應該可以看到。
</div>

會顯示為:

這段文字不能摺疊,但下一段可以摺疊且預設隱藏:

這段文字預設為隱藏。

這段文字應該可以看到。

自訂按鈕文字

不喜歡連結中的 展開/摺疊 這一對用語?沒問題!你可以使用"data-expandtext"來作展開的文字設定,以及"data-collapsetext"來作摺疊的修改。

{| class="article-table mw-collapsible" data-expandtext="顯示" data-collapsetext="隱藏"
!我的 || 頂部
|-
| A || B
|-
| C || D
|}

會顯示為:

我的 頂部
A B
C D

開關按鈕

如果你注意到上面例子中的表格,在第二欄中的鏈接實際上把表格的欄位變寬了。要解決這個問題,我們可以把這個開關設置在頁面中的其他地方。

要這樣做,我們需要先幫這個單元取一個ID。這個ID必須以"mw-customcollapsible-"為開頭,接著是一個獨特的名字。使用上面的表格,我們可以設定它的ID為 "mw-customcollapsible-myTable".

接著,我們要用"mw-customtoggle-myTable"作為一個class來增加一個按鈕(或連結、文字)(注意class跟上述的ID不同),例如:

{| class="article-table mw-collapsible" id="mw-customcollapsible-myTable"
!我的 || 頂部
|-
| A || B
|-
| C || D
|}

<div class="mw-customtoggle-myTable wikia-menu-button">顯示/隱藏 表格</div>

會顯示為:

我的 頂部
A B
C D

顯示/隱藏 表格

另參見

幫助及反饋

除了特别提示,社区内容遵循CC-BY-SA 授权许可。