帮助:表格
一个表格是用于组织和定位数据的列和行的排列。表格对于此目的很有用，并且可以使用许多不同的样式和技巧来定制每个表格。此页面为您提供有关在维基教科书中构建表格的语法的相关信息。
使用工具栏
要自动插入表格，请单击 
在 编辑工具栏 上。
单击按钮并接受默认值时，将插入以下文本
{| class="wikitable"
|-
! Header text !! Header text !! Header text
|-
| Example || Example || Example
|-
| Example || Example || Example
|-
| Example || Example || Example
|}
| 标题文本 | 标题文本 | 标题文本 |
|---|---|---|
| 示例 | 示例 | 示例 |
| 示例 | 示例 | 示例 |
| 示例 | 示例 | 示例 |
示例文本（“标题文本”或“示例”）需要替换为实际数据。在单击“插入表格”按钮后出现的初始对话框中，可以自定义列数和行数。
语法教程
|
| ||||||||||||||||||||||||||||||||||||||||||
如果你使用单竖线，那么可能看起来像第一个单元格的实际上是应用于该单元格的格式修饰符，而你剩下的“单元格”将合并成一个
{| style="border:1px;"
|-
|format modifier (not displayed) |These all |(including the pipes) |go into |the first cell
|}
这可能不是你想要的
| 这些都 |(包括竖线)|进入 |第一个单元格 |
但是，格式修饰符很有用
{| style="border:1px;"
|-
| Cell 1 (no modifier—not aligned)
|-
| style="text-align: right;" | Cell 2 (right aligned)
|}
| 单元格 1 (无修饰符 — 未对齐) |
| 单元格 2 (右对齐) |
请记住：每行最多只能使用 2 个单竖线！
一行列标题用“! scope="col" |”而不是“|”来标识，用“!! scope="col" |”而不是“||”来标识。标题单元格通常以不同于普通单元格的方式呈现，具体取决于浏览器。它们通常以粗体字体居中呈现。
{|
|+ The table's caption
! scope="col" | Column heading 1
! scope="col" | Column heading 2
! scope="col" | Column heading 3
|-
| Cell 1 || Cell 2 || Cell 3
|-
| Cell A
| Cell B
| Cell C
|}
一行的第一个单元格被标识为行标题，方法是在行的开头使用“! scope="row" |”而不是“|”，并在新行上开始后续数据单元格。
{|
|+ The table's caption
! scope="col" | Column heading 1
! scope="col" | Column heading 2
! scope="col" | Column heading 3
|-
! scope="row" | Row heading 1
| Cell 2 || Cell 3
|-
! scope="row" | Row heading A
| Cell B
| Cell C
|}
可选的参数可以修改单元格、行或整个表格的行为。例如，可以向表格添加边框
{| border="1"
|+ The table's caption
! scope="col" | Column heading 1
! scope="col" | Column heading 2
! scope="col" | Column heading 3
|-
! scope="row" | Row heading 1
| Cell 2 || Cell 3
|-
! scope="row" | Row heading A
| Cell B
| Cell C
|}
最终表格将以以下方式显示
| 列标题 1 | 列标题 2 | 列标题 3 |
|---|---|---|
| 行标题 1 | 单元格 2 | 单元格 3 |
| 行标题 A | 单元格 B | 单元格 C |
每行必须与其他行具有相同数量的单元格，以便表格中的列数保持一致。对于空单元格，请使用不间断空格 作为内容，以确保单元格显示出来。要显示单元格中的可见竖线，请使用<nowiki>|</nowiki>或|.
简单示例
这两个都会生成相同的输出。根据每行中的单元格数量和每个单元格内的总文本选择一种样式。
维基标记代码
{|
| A
| B
|-
| C
| D
|}
{|
| A || B
|-
| C || D
|}
它在你的浏览器中看起来像这样
| A | B |
| C | D |
标准格式
你可以添加class="wikitable"在{|在表格开头的旁边，以应用标准格式，该格式将背景颜色应用于表格标题，并在单元格之间以及表格周围添加边框。
{| class="wikitable" style="text-align: center; width: 200px; height: 200px;"
|+ Multiplication table
|-
! scope="col" | ×
! scope="col" | 1
! scope="col" | 2
! scope="col" | 3
|-
! scope="row" | 1
| 1 || 2 || 3
|-
! scope="row" | 2
| 2 || 4 || 6
|-
! scope="row" | 3
| 3 || 6 || 9
|-
! scope="row" | 4
| 4 || 8 || 12
|-
! scope="row" | 5
| 5 || 10 || 15
|}
以及它在你的浏览器中看起来像这样
| × | 1 | 2 | 3 |
|---|---|---|---|
| 1 | 1 | 2 | 3 |
| 2 | 2 | 4 | 6 |
| 3 | 3 | 6 | 9 |
| 4 | 4 | 8 | 12 |
| 5 | 5 | 10 | 15 |
颜色
为单个单元格指定文本和背景颜色的方法如下。
维基标记代码
{|
| style="background: red; color: white" | abc
| def
| style="background: red; color: white" | ghi
| jkl
|}
它在你的浏览器中看起来像这样
| abc | def | ghi | jkl |
与其他参数一样，也可以为整行或整个表格指定颜色；行参数会覆盖表格的值，单元格参数会覆盖行的值。（请注意，没有简单的方法可以为整列指定颜色——必须单独指定列中每个单元格的颜色。）
维基标记代码
{| style="background: yellow; color: green"
|-
| abc || def || ghi
|- style="background: red; color: white"
| jkl || mno || pqr
|-
| stu || style="background: silver" | vwx || yz
|}
它在你的浏览器中看起来像这样
| abc | def | ghi |
| jkl | mno | pqr |
| stu | vwx | yz |
要使表格与背景融合，请使用style="background: none;"或style="background: transparent;"。
要强制单元格匹配class="wikitable"的默认颜色之一，请为较深的标题使用style="background: #f2f2f2"，为较浅的主体使用style="background: #f9f9f9"。
宽度，高度
可以指定整个表格的宽度和高度，以及行的高度。要指定列的宽度，可以指定其中任意一个单元格的宽度。如果未为所有列指定宽度，或未为所有行指定高度，则会存在一些模糊性，结果将取决于浏览器。
维基标记代码
{| style="width: 75%; height: 200px;" class="wikitable"
|-
| abc || def || ghi
|- style="height:100px;"
| jkl || style="width:200px;" | mno || pqr
|-
| stu || vwx || yz
|}
它在你的浏览器中看起来像这样
| abc | def | ghi |
| jkl | mno | pqr |
| stu | vwx | yz |
设置列宽
要强制列宽符合特定要求，而不是接受列中单元格中最宽文本元素的宽度，请按照以下示例操作。请注意，文本的换行被强制执行。
维基标记代码
{| class="wikitable"
! scope="col" style="width:50px;" | Name
! scope="col" style="width:225px;" | Effect
! scope="col" style="width:225px;" | Games Found In
|-
| Poké Ball || Regular Poké Ball || All Versions
|-
| Great Ball || Better than a Poké Ball || All Versions
|}
| 名称 | 效果 | 发现的游戏 |
|---|---|---|
| 精灵球 | 普通精灵球 | 所有版本 |
| 高级球 | 比精灵球好 | 所有版本 |
要设置没有标题的表格中的列宽，请在每列的第一个单元格中指定宽度，如下所示
{| class="wikitable"
|-
| style="width:100px;" | This column is 100 pixels wide
| style="width:200px;" | This column is 200 pixels wide
| style="width:300px;" | This column is 300 pixels wide
|-
| blah || blih || bluh
|}
| 此列宽 100 像素 | 此列宽 200 像素 | 此列宽 300 像素 |
| blah | blih | bluh |
设置边框
表格边框默认为复杂的阴影双线（HTML 中的默认值）；但是，可以使用样式参数将这些边框设置为细实线（style="border: 1px solid darkgray"），如以下所示（注意：如果你打算将“cellpadding”或“cellspacing”选项与边框一起使用，则必须使用此格式）
{| cellpadding="2" style="border: 1px solid darkgray;"
! style="width: 140px;" | Left
! style="width: 150px;" | Middle
! style="width: 130px;" | Right
|- style="border:none;"
| [[File:StarIconBronze.png|120px]]
| [[File:StarIconGold.png|120px|Caption when mouse-over image]]
| [[File:StarIconGreen.png|120px|Green stellar icon]]
|- style="text-align:center;"
| Bronze star || Gold star || Green star
|}
请注意，底部行文本通过style="text-align: center;"居中，而星形图像未居中。
| 左 | 中 | 右 |
|---|---|---|
|
|
|
| 青铜星 | 金星 | 绿星 |
只要文件省略参数“thumb”，它们就不会显示边框。边框颜色“darkgray”与使用class="wikitable"显示的颜色一致；但是，它可以是任何颜色名称（如style="border: 1px solid darkgreen;"）或使用十六进制颜色（如：#DDCCBB）。有关十六进制颜色的信息，请参阅 网页颜色，这些颜色允许你指定任何你想要的色调。
列格式说明符（用“|...|”括起来）可以包含一个样式参数来设置每个单元格的边框，如下所示
{| cellpadding="2" style="border: 1px solid darkgray;"
! style="width: 140px;" | Left
! style="width: 150px;" | Middle
! style="width: 130px;"| Right
|- style="text-align: center;"
| style="border: 1px solid blue;"|
[[File:StarIconBronze.png|120px]]
| style="border: 1px solid #777777;"|
[[File:StarIconGold.png|120px|Caption when mouse-over image]]
| style="border: 1px solid #22AA55;"|
[[File:StarIconGreen.png|120px|Green stellar icon]]
|- style="text-align: center;"
|Bronze star || Gold star || Green star
|}
请注意，只有图像单元格有单独的边框，文本没有。
| 左 | 中 | 右 |
|---|---|---|
|
|
|
|
| 青铜星 | 金星 | 绿星 |
较低的十六进制颜色（如：#616161）更接近黑色。通常，表格中的所有边框都应该是相同的颜色。
垂直对齐
默认情况下，表格中的数据垂直对齐到单元格的中间，导致布局如下
| 行标题 | 一段较长的文字。Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. | 短文本 |
|---|
要解决此问题，请应用style="vertical-align: top;"到行中（不幸的是，需要对每一行单独应用此属性）。例如
{| class="wikitable" style="width: 400px;"
|- style="vertical-align: top;"
! scope="row" style="width: 10%;" | Row heading
| style="width: 70%;" | A longer piece of text. Lorem ipsum...
| style="width: 20%;" | short text
|- style="vertical-align: top"
! scope="row" | Row heading
| Excepteur sint occaecat...
| short text
|}
| 行标题 | 一段较长的文字。Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. | 短文本 |
|---|
浮动表格
维基标记代码
This paragraph is before the table. Lorem ipsum dolor sit
amet, consectetur adipisicing elit, sed do eiusmod...
{| style="float: right;" class="wikitable"
| Col 1, row 1
| rowspan="2" | Col 2, row 1 (and 2)
| Col 3, row 1
|-
| Col 1, row 2
| Col 3, row 2
|}
Note the floating-table to the right.
This paragraph is after the table. The text in column 2
will span both rows due to format specifier <tt>"rowspan=2"</tt> so there
is no coding for "Col 2" in the 2nd row, just: Col 1 & Col 3.
它在你的浏览器中看起来像这样
本段文字位于表格之前。Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod...
| 第 1 列，第 1 行 | 第 2 列，第 1 行（和第 2 行） | 第 3 列，第 1 行 |
| 第 1 列，第 2 行 | 第 3 列，第 2 行 |
请注意右侧的浮动表格。
本段文字位于表格之后。由于格式说明符“rowspan=2”，第 2 列中的文本将跨越两行，因此第 2 行中没有“第 2 列”的代码，只有：第 1 列和第 3 列。
居中表格
可以实现居中表格，但它们不会“浮动”；也就是说，两侧不会出现任何文本。诀窍是{| style="margin: 1em auto 1em auto;"
维基标记
{| class="wikitable" style="margin: 1em auto 1em auto;"
|+ '''Cells left-aligned, table centered'''
! scope="col" | Duis
! scope="col" | aute
! scope="col" | irure
|-
| dolor || in reprehenderit || in voluptate velit
|-
| esse cillum dolore || eu fugiat nulla || pariatur.
|}
它在你的浏览器中看起来像这样
| Duis | aute | irure |
|---|---|---|
| dolor | in reprehenderit | in voluptate velit |
| esse cillum dolore | eu fugiat nulla | pariatur. |
可折叠表格
您可以创建一个可折叠并隐藏的表格。添加class="collapsible"到表格顶部，或在“wikitable”后添加“collapsible”以启用折叠行为。默认情况下，可折叠表格将以折叠状态开始。要更改此设置，请包含附加类“selected”。您必须包含一个标题行，其中将显示展开和折叠的控件。示例
{| class="wikitable collapsible selected"
! Header
|-
| Content which starts shown
|-
| Click the header row to collapse
|}
给出
| 标题 |
|---|
| 最初显示的内容 |
| 单击标题行以折叠 |
可排序表格
通过添加以下内容，可以使表格可排序class="sortable". 由于此功能非常有用，因此在设计表格时明智地牢记此功能的可能性和局限性。例如
- 不要通过跨越多行的子标题将表格分成多个部分。相反，可以创建一个额外的列，以简短形式在每一行上显示这些标题的内容。
- 不要让元素跨越多列；相反，同样地，以简短形式在每一行上重复内容。
- 在一列数字中，不要在数字前面放置“ca.”之类的文本 - 它会像零一样排序。不要在数字后放置文本，也不要放置数字范围。相反，将这些文本放在单独的列中。
简短内容的详细形式可以作为图例放在表格外部。
维基标记
{| class="wikitable sortable"
|+ Sortable table
|-
! scope="col" | Alphabetic
! scope="col" | Numeric
! scope="col" | Date
! scope="col" class="unsortable" | Unsortable
|-
| d || 20 || 2008-11-24 || This
|-
| b || 8 || 2004-03-01 || column
|-
| a || 6 || 1979-07-23 || cannot
|-
| c || 4 || 1492-12-08 || be
|-
| e || 0 || 1601-08-13 || sorted.
|}
它在你的浏览器中看起来像这样
| 字母顺序 | 数字顺序 | 日期 | 不可排序 |
|---|---|---|---|
| d | 20 | 2008-11-24 | 此 |
| b | 8 | 2004-03-01 | 列 |
| a | 6 | 1979-07-23 | 无法 |
| c | 4 | 1492-12-08 | 被 |
| e | 0 | 1601-08-13 | 排序。 |