2023年政策修订增补工作正在进行中,欢迎参与!
  • Moegirl.ICU:萌娘百科流亡社群 581077156(QQ),欢迎对萌娘百科运营感到失望的编辑者加入
  • Moegirl.ICU:账号认领正在试运行,有意者请参照账号认领流程

模板:Navbox

萌娘百科,萬物皆可萌的百科全書!轉載請標註來源頁面的網頁連結,並聲明引自萌娘百科。內容不可商用。
跳至導覽 跳至搜尋
Template-info.svg 模板文檔  [查看] [編輯] [歷史] [刷新]

使用此模板可以相對方便和快速地歸納同類型條目去創作一個導航模板(這裡指的是分類:大家族模板)。

可變參數十分多,可以配合{{Navbox subgroup}}、{{Navbox with columns}}、{{Navbox with collapsible groups}}使用。

常用參數

name
模板的名稱(「Template:」後面的部分,注意不是模板的標題),像:「萌屬性」。
title
標題欄的文字,像:「屬性&萌屬性」,不一定與name相同。
state
[mw-uncollapsed, mw-collapsed]
方框的摺疊狀態。
titlestylegroupstyleevenstyle
分別用於標題欄、group、偶數list(這部分默認是淡綠色)的CSS樣式,像:background:gray
above
在group/list區段之上顯示的內容。
groupn
左側的文字,在listn之前(如果groupn被省略,listn從方框的左側開始)。
listn
列出維基鏈接的文字,通常以圓點符號分隔,像:[[A]] • [[B]] • …
below
在group/list區段之下顯示的可選文字。
包含常見參數的源代碼,可複製後用於快速創建大家族模板

不使用的參數請刪掉,勿保留。

{{Navbox
|name  = {{subst:PAGENAME}}
|title = 
|state = 
|titlestyle= background:
|groupstyle= background:
|evenstyle = background:

|above = 

|group1= 
|list1 = [[]] • <!--
      -->[[]]

|group2= 
|list2 = [[]] • <!--
      -->[[]]

|group3= 
|list3 = [[]] • <!--
      -->[[]]

|group4= 
|list4 = [[]] • <!--
      -->[[]]

|group5= 
|list5 = [[]] • <!--
      -->[[]]

|group6= 
|list6 = [[]] • <!--
      -->[[]]

|below = 
}}

Navbox其他大部分參數都不常用,所以將常用參數封裝成兩個簡化模板:{{大家族}}和{{大家族內容行}}({{Links}})。

一些常用參數的效果參見#表格的布局#示例;進一步的細節,以及複雜的約束,在下方#參數描述章節作了解釋。

參數描述

下面是用於{{Navbox}}的參數的一個完整清單。在大多數情況下,只要有參數nametitlelist1就可以了,儘管子導航框甚至不需要設置那些參數。

{{Navbox}}與它的姊妹模板{{Navbox with columns}}、{{Navbox with collapsible groups}}共用很多常用的參數,以提高一致性與易用性。帶一個「」標記的參數適用於所有這三個主模板。

設置參數

name
模板的名稱。為了在所有使用了所生成模板的頁面上,「查 • 論 • 編」鏈接都能正確地工作,就需要設置這個參數。你可以輸入{{subst:PAGENAME}}作為這個參數的值,這也是個快捷的方法。此參數是必需的。
state
[mw-uncollapsed, mw-collapsed, plain, off]
  • 如果設置為mw-collapsed,該導航框總會在開始時以摺疊起來的狀態展現。
  • 如果設置為plain,該導航框總會在被展開時不帶右側的「隱藏」鏈接,並且標題會保持居中(通過使用補白來偏移「查 • 論 • 編」鏈接)。
  • 如果設置為off,該導航框總會在被展開時不帶右側的「隱藏」鏈接,但是沒有補白會被用來保持標題居中。這只是為了高級用法;「plain」選項應能滿足大多數需要將「顯示」/「隱藏」按鈕隱藏起來的應用。
  • 如果設置為除mw-collapsedplainoff之外的其它值(像「mw-uncollapsed」),該導航框總會在開始時以展開的狀態出現,但是帶有「隱藏」按鈕。
很多時候,對於一個導航框,編輯者會想要一個缺省的初始狀態,並且在條目中它可以被覆寫。要做到這一點,這裡有個竅門:
在你的模板里,創建一個參數也命名為「state」作為一個傳遞,像這樣:
  • |state = {{{state<includeonly>|你想要的初始状态</includeonly>}}}
  • <includeonly>|會使得當查看模板頁面本身時,模板會被展開。
navbar
缺省為Navbar。如果設置為plain,在標題欄左側的查 • 論 • 編鏈接不會顯示出來,而且補白會被自動應用以保持標題居中。設置為off可以移除查 • 論 • 編鏈接,但是不會應用補白(這只是為了高級用法;「plain」選項應能滿足大多數不想要導航欄的應用。)強烈建議使用者不要隱藏導航欄,為的是使用戶編輯該模板更加容易,並且可以貫穿各個頁面都有一個標準的風格。
border
[subgroup, child, none]
如果設置為以上三個值,導航框都將沒有邊框,不過使用上還是有些許差別的。詳見#子導航框
class
為Navbox主體table元素設置class

單元格

title
顯示在表格頂端一行居中位置的文字。它通常是該模板的主題,也就是主體內容的一個簡要描述。這應該是單獨的一行,但是如果需要第二行,請使用{{brClear}}來保證正確的居中。本參數從技術上來說不是必需的,但是使用{{Navbox}}而不帶標題是相當沒有意義的。
groupn
(即group1group2等等)如果被指定,文字會顯示在位於listn左側的抬頭單元格中。如果被省略,listn占用表格的全部寬度。
listn
(即list1list2等等)該模板的主體,通常為一欄鏈接。格式為內聯;然而,如果整個列表被裝入<div> </div>之內,文字能夠被輸入到不同的行中。最少需要一個list參數;每個附加的list被顯示在一個單獨的表格行中。每個listn可能在其前面有一個相對應的groupn參數,如果提供了的話(參見下方)。
image
一張圖片,會顯示在標題(title)之下、主體(group/list)之右側的一個單元格中。為使圖片能正確地顯示,必須指定list1參數。image參數接受標準的維基代碼來顯示圖片,即:
image = [[File:Example.jpg|100px]](參見Help:圖像
imageleft
一張圖片,會顯示在標題(title)之下、主體(list)之左側的一個單元格中。為使圖片能正確地顯示,必須指定list1參數,而且不能指定分組(group)。imageleft參數接受標準的維基代碼來顯示圖片,即:
imageleft = [[File:Example.jpg|100px]]
above
一個全寬度單元格,顯示在標題欄與第一個group/list之間,也就是位於該模板的主體(group、list和image)之上。在一個不帶圖片的模板中,above與不帶group1參數的list1參數以同樣的方式運作。
below
一個全寬度單元格,顯示在該模板主體(group、list和image)的下方。在一個不帶圖片的模板中,below與該模板最後面的不帶groupn參數的listn參數以同樣的方式運作。作為一個使用了below參數的示例,請參見{{非洲}}。

樣式參數

style
指定應用到模板主體的CSS樣式。bodystyle參數也有下面舉例的同樣效果,並能被用來代替這個style參數。此選項應謹慎使用,因為它可以導致視覺上的不一致。舉例:
  • style = background:#nnnnnn;
  • style = width:N [em/%/px or width:auto];
  • style = float:[left/right/none];
  • style = clear:[right/left/both/none];
titlestyle
應用到title的CSS樣式,最常見的有導航欄的背景顏色:
  • titlestyle = background:#nnnnnn;
  • titlestyle = background:name;
groupstyle
應用到所有group單元格的CSS樣式。該選項覆寫應用於整個表格的任何樣式。舉例:
  • groupstyle = background:#nnnnnn;
  • groupstyle = text-align:[left/center/right];
  • groupstyle = vertical-align:[top/middle/bottom];
groupnstyle
應用到特定groupN的CSS樣式。擁有最高的顯示優先級,可以分別指定不同的group顯示不同效果。
liststyle
應用到所有list的CSS樣式。若指定了下面的listnstyle、oddstyleevenstyle參數,則它們的優先級高於本參數。
listnstyle
應用到特定listN的CSS樣式。擁有最高的顯示優先級,可以分別指定不同的list顯示不同效果。
oddstyleevenstyle
應用到奇數/偶數編號的列表。會推翻由liststyle定義的樣式。缺省的表現是分別添加條紋狀的顏色(白色和灰色)到奇數/偶數行,以提高可讀性。除了在非常特別的情況下,這些設置不應更改。
evenodd
[swap, even, odd]
設置為swap可使每個list奇偶翻轉;可用於解決插入子導航框後奇偶樣式錯位的問題。
設置為evenodd可使所有list的樣式全為偶數行或奇數行的樣式。
abovestylebelowstyle
應用到頂端單元格(通過above參數指定)和底端單元格(通過below參數指定)。典型地被用來設置背景顏色或文本對齊方式:
  • abovestyle = background:#nnnnnn;
  • abovestyle = text-align:left/center/right;
缺省樣式

這裡列出的樣式設置是使用導航框的編輯者最經常更改的那些設置。其它更加複雜的樣式設置被排除在這個列表之外,以保持它簡單。大多數樣式是在MediaWiki:Common.css中設置。

bodystyle  = background:#fdfdfd; width:100%; vertical-align:middle;
titlestyle = background:#ccccff; padding-left:1em; padding-right:1em; text-align:center;
abovestyle = background:#ddddff; padding-left:1em; padding-right:1em; text-align:center;
belowstyle = background:#ddddff; padding-left:1em; padding-right:1em; text-align:center;
groupstyle = background:#ddddff; padding-left:1em; padding-right:1em; text-align:right;
liststyle  = background:transparent; text-align:left/center;
oddstyle   = background:transparent;
evenstyle  = background:#f7f7f7;

由於liststyleoddstyle是透明的,奇數列表有bodystyle的顏色,其缺省值是#fdfdfd(白色帶有少許灰色)。一個list有text-align:left;設定,如果它有一個group的話;否則,它有text-align:center;設定。由於只有bodystyle有一個垂直對齊(vertical-align)屬性,所 有其它樣式繼承其vertical-align:middle;設定。

表格的布局

由{{Navbox}}不帶imageabovebelow參數生成的表格(添加了灰色的列表背景色僅僅是為了演示):


由{{Navbox}}帶有imageabovebelow參數生成的表格(添加了灰色的列表背景色僅僅是為了演示):


由{{Navbox}}帶有imageimageleftlists,且不帶groupsabovebelow生成的表格(添加了灰色的列表背景色僅僅是為了演示):

示例

第一期表情包共創素材No.16.png
使用萌娘百科目前的默認皮膚MoeSkin時,{{Navbox}}中的圖片不會顯示。

不帶圖片

{{Navbox
|name  = Navbox/doc
|title = [[大洗女子學園]]學生社團成員

|group1= 排球部
|list1 = [[磯邊典子]] • <!--
      -->[[河西忍]] • <!--
      -->[[佐佐木明日]] • <!--
      -->[[近藤妙子]]

|group2= 汽車部
|list2 = [[中島麗羅]] • <!--
      -->[[鈴木(少女與戰車)|鈴木]] • <!--
      -->[[星野(少女與戰車)|星野]] • <!--
      -->[[土屋(少女與戰車)|土屋]]

|group3= 廣播部
|list3 = [[王大河]]
}}

帶圖片,不帶分組

{{Navbox
|name  = Navbox/doc
|title = [[大洗女子學園]]學生社團成員
|image = [[File:GUP_Ooarai.svg|80px]]
|list1 = [[磯邊典子]] • <!--
      -->[[河西忍]] • <!--
      -->[[佐佐木明日]] • <!--
      -->[[近藤妙子]] • <!--
      -->[[中島麗羅]] • <!--
      -->[[鈴木(少女與戰車)|鈴木]] • <!--
      -->[[星野(少女與戰車)|星野]] • <!--
      -->[[土屋(少女與戰車)|土屋]] • <!--
      -->[[王大河]]
}}

帶兩張圖片,不帶分組,多重列表

{{Navbox
|name  = Navbox/doc
|title = [[大洗女子學園]]學生社團成員
|image = [[File:GUP_Ooarai.svg|80px]]
|imageleft = [[File:GUP Logo Alpha0.svg|80px]]

|list1 = [[磯邊典子]] • <!--
      -->[[河西忍]] • <!--
      -->[[佐佐木明日]] • <!--
      -->[[近藤妙子]]

|list2 = [[中島麗羅]] • <!--
      -->[[鈴木(少女與戰車)|鈴木]] • <!--
      -->[[星野(少女與戰車)|星野]] • <!--
      -->[[土屋(少女與戰車)|土屋]]

|list3 = [[王大河]]
}}

帶有圖片、分組、上方注釋、下方注釋

{{Navbox
|name  = Navbox/doc
|title = [[大洗女子學園]]學生社團成員
|image = [[File:GUP_Ooarai.svg|80px]]

|above = (僅列出參加了社團的成員)

|group1= 排球部
|list1 = [[磯邊典子]] • <!--
      -->[[河西忍]] • <!--
      -->[[佐佐木明日]] • <!--
      -->[[近藤妙子]]

|group2= 汽車部
|list2 = [[中島麗羅]] • <!--
      -->[[鈴木(少女與戰車)|鈴木]] • <!--
      -->[[星野(少女與戰車)|星野]] • <!--
      -->[[土屋(少女與戰車)|土屋]]

|group3= 廣播部
|list3 = [[王大河]]

|below = 《[[少女與戰車]]》官網:https://girls-und-panzer.jp/
}}

子導航框

主頁面:Template:Navbox subgroup

要在父級導航框中放置子導航框,{{Navbox subgroup}}是推薦的用法。但通過在{{Navbox}}加入|border = subgroup/child或將第一個參數(無名)設為subgroup/child也可以達到同樣的效果。子導航框不需要name參數。

{{Navbox subgroup
|group1= 
|list1 = 

|group2= 
|list2 = 
……
}}
{{Navbox|border=subgroup
|group1= 
|list1 = 

|group2= 
|list2 = 
……
}}
{{Navbox subgroup
|group1= 
|list1 = 

|group2= 
|list2 = 
……
}}

它看起來是這樣:

接着把它放進某個list中即可(可增加縮進來表明層級關係)。例如:

{{Navbox
|name  = Navbox/doc
|title = 子導航框示例

|group1= 分組1
|list1 = 列表1

|group2= 分組2
|list2 = {{Navbox subgroup
  |evenodd = swap

  |group1= 分組2.1
  |list1 = 列表1

  |group2= 分組2.2
  |list2 = 列表2

  |group3= 分組2.3
  |list3 = 列表3
  }}

|group3= 分組3
|list3 = 列表3
}}

可以注意到上面使用了一個evenodd參數,這是用來調整某些子分組中條紋狀顏色帶的分布,以確保顏色帶交叉排列。如果想去除所有的條紋顏色帶,可以在每個Navbox中設置liststyle = background:transparent

從設計者的思路來看,border = subgroupborder = child是適用於不同情況的。設為subgroup時group更窄,適用於子導航框的group與父導航框的group並排排列,如上面的例子中,分組2.X與分組2在一行;而child的group保持默認寬度,適合子導航框的group充當第一級group,如下面的#多重展開/摺疊不過混用也沒幾個人會發現。

border = none的外觀與subgroup、child相似,但是它適用於「不在導航框中使用」的情況,比如把{{Navbox|none …}}嵌入到某個其他模板(並非此模板及其姊妹模板)中。相反,不要把subgroup、child嵌入到Navbox及姊妹模板之外的模板,會造成潛在的錯誤。

多重展開/摺疊

主頁面:Template:Navbox with collapsible groups

當大家族模板內容過多時,可考慮使用多重展開/摺疊。可使用{{Navbox with collapsible groups}},更為方便、直觀。只使用Navbox也可以實現:

{{Navbox
|name  = Navbox/doc
|title = ……

|list1 = {{Navbox|child
  |navbar = plain
  |title  = ……
  ……
  }}

|list2 = {{Navbox|child
  |navbar = plain
  |title  = ……
  ……
  }}

|list3 = {{Navbox|child
  |navbar = plain
  |title  = ……
  ……
  }}
}}

與其它導航框模板的關係

此導航框模板被特別設計使得能與另外兩個姊妹模板協同工作:{{Navbox with columns}}和{{Navbox with collapsible groups}}。所有這三個模板共享常用的參數,以提高一致性與易用性(此類參數在上面的完整參數列表中用作了標記)。最重要的是,所有這三個模板能互相被用作另一個的子模板(通過使用border = child參數,或將第一個參數(無名)指定為child。例如,使用{{Navbox|child …}}{{Navbox with columns|child …}}{{Navbox with collapsible groups|child …}})。

技術細節

運作詳情

  • 列表單元格寬度初始被設置為100%。因此,如果你想手動設置分組單元格的寬度,你就需要同時指定liststyle使之有width:auto。如果你想設置分組寬度並使用圖片,這取決於你已弄明白在groupstyle、liststyle、imagestyle和imageleftstyle參數中的CSS,以使所有部件都工作正常。以下兩行是設置分組寬度的示例:
    groupstyle = width:10em;
    liststyle = width:auto;
  • 相鄰的導航框在它們之間僅有一個1px的邊框。如果你設置了style / bodystyle的頂端外邊距(margin-top)或底端外邊距(margin-bottom),那麼此特性就不運作了。
  • 外層導航框表格的缺省的左外邊距(margin-left)和右外邊距(margin-right)被設置為「auto;」。如果你想使用導航框作為一個浮動對象(float),你需要手動設置左外邊距和右外邊距的值,因為自動外邊距(auto margins)會阻止浮動(float)選項。例如,添加下列代碼來使用導航框作為一個浮動對象:
    style = width:22em;float:right;margin-left:1em;margin-right:0

參見

  • {{Navbox subgroup}} – 允許在導航框內分組。
  • {{Navbox with columns}} – 允許以欄取代組別/列表。
  • {{Navbox with collapsible groups}} – 另一種變體。
  • {{Nobold}} – 當預設文字樣式設定為粗體時,可用來顯示無粗體文字的模板。
  • {{W}} ( • ) – 分隔列表項目的圓點。
  • {{nav-s}} – 在標題中顯示前任、繼任導航模板。