Wikipedia:使用表格

取自食品百科全书

(修订版本间差异)

跳转到: 导航, 搜索

当前修订版本

表格可以让大量数据呈现出良好的视觉效果，是所有用户的重要排版功能之一。同时，表格的样式控制功能丰富，可以为高级用户提供页面布局的有效手段。

从2003年12月8日起，MediaWiki采用了简化的表格控制符号取代HTML代码，使得表格的使用大为方便。在简化格式中同样可以使用表格样式控制参数。

[编辑] 基础用法

[编辑] 基础范例

规则表格的基础用法如下：

{|
| 第1行第1列 || 第1行第2列 || 第1行第3列
|-
| 第2行第1列 || 第2行第2列 || 第2行第3列
|-
| 第3行第1列 || 第3行第2列 || 第3行第3列
|}

效果如下：

第1行第1列	第1行第2列	第1行第3列
第2行第1列	第2行第2列	第2行第3列
第3行第1列	第3行第2列	第3行第3列

范例说明：

“{|”、“|}”是表格的头尾，“|-”代表表格换行，“|”引导表格行内容并以“||”分开不同单元格

注意：表格控制符必须在行首书写！非行首表格代码将不被认可

单元格内容可包含链接、图片等，以及嵌套内部表格。

（规则表格写法简单；行或列重单元格数量不同意的不规则表格制作需要了解colspan、rowspan命令，这是html内容）

mediawiki的默认表格没有边框，如果需要的话需添加参数。（见下文介绍）

border="1" cellspacing="0" 是边框样式，不写的话就不出边框

本例中所有单元格也可以展开书写，示例如下：（有些人认为这样的代码更规整）

{|border="1" cellspacing="0" 
| 第1行第1列 
| 第1行第2列
| 第1行第3列
|-
| 第2行第1列 
……
| 第3行第3列
|}

如果希望增加标题行，可在表格内容正文之前增加

|+ '''标题行，可以不使用本行'''
|-

显示效果如下：

**标题行，可以不使用本行**
第1行第1列	第1行第2列	第1行第3列
第2行第1列	第2行第2列	第2行第3列
第3行第1列	第3行第2列	第3行第3列

在单元格中还可以包含下级表格，还需要进一步将表格内容换行到下一行行首。参见后文的例子。

[编辑] 表格语法详解

在MediaWiki中，表格代码实际可以完全按HTML规范进行书写。具体的HTML表格介绍请参考相关HTML资料，下面说明MediaWiki表格控制符与HTML代码的对应关系

[编辑] 表格控制符table

在HTML中，表格是以table标签来包围的。下面的简化表格代码：

{| 参数
|}

实际相当于 <table 参数> 和 </table>

[编辑] 单元格控制符td

单元格可以这样产生：

|单元1
|单元2
|单元3

或者这样也可以：

|单元1||单元2||单元3

相当于 <td>单元1</td><td>单元2</td><td>单元3</td> 其中“||”相当于“新起一行”+“|”

在单元格中可以这样使用参数，以便控制单元格的宽度、颜色等样式：

|参数|单元1

相当于 <td 参数> 。mediawiki的单元格参数可以是：

align="xxx" …… xxx为文字内容的水平对齐控制参数，取值为left、center或right。不设置时默认为left
valign="yyy" …… yyy为垂直对齐对位参数，取值为top、middle或bottom。不设置时默认为middle
style="zzz;" …… zzz为CSS样式。mediawiki表格的单元格宽度、背景色等控制应在这里设置。

[编辑] 表头控制符th

表头是一种特别的单元格，在多数浏览器中表头内容以粗体显示。表头的使用方法与单元格类似，仅仅用“!”代替“|”，用“!!”代替“||”；但是参数仍然使用“|”。

对于希望第一行、第一列都希望粗体显示的表格，可以如下书写：（注意第2、3行的表头之后应换行书写！）

{|border="1" cellspacing="0" 
|-
! 第1行第1列 !! 第1行第2列 !! 第1行第3列
|-
! 第2行第1列 
| 第2行第2列 || 第2行第3列
|-
! 第3行第1列 
| 第3行第2列 !! 第3行第3列
|}

效果如下：

第1行第1列	第1行第2列	第1行第3列
第2行第1列	第2行第2列	第2行第3列
第3行第1列	第3行第2列 !! 第3行第3列

[编辑] 新行控制符tr

产生新的表格行，应在新行内容之前加入一行：

|-

这相当于 <tr> （附注：该行中的减号多几个也没有不良影响，例如写成|----等）可以这样添加参数：

|- 参数

相当于 <tr 参数>

[编辑] 标题控制符caption

在表格代码中插入如下代码即可产生表格标题：

|+ 标题

这相当于 <caption>标题</caption>

需要使用参数控制格式时，可以这样书写：

|+ 参数|标题

相当于 <caption 参数>标题

[编辑] 复杂的例子

单元1, 行1	单元2, 行1 (和2)	单元3, 行1
单元1, 行2	单元2, 行1 (和2)	单元3, 行2

注意这个表格将右对齐。

{| align=right border=1
| 单元1, 行1
|rowspan=2| 单元2, 行1 (和2)
| 单元3, 行1
|-
| 单元1, 行2
| 单元3, 行2
|}

同时使用COLSPAN和ROWSPAN：

{| border="1" cellpadding="5" cellspacing="0"
|-
! 栏目一 || 栏目二 || 栏目三
|-
| rowspan=2| A
| colspan=2 align="center"| B
|-
| C
| D
|-
| E
| colspan=2 align="center"| F
|- 
| rowspan=3| G
| H
| I
|- 
| J
| K
|-
| colspan=2 align="center"| L
|}

将有这样的效果：

栏目一	栏目二	栏目三
A	B
A	C	D
E	F
G	H	I
	J	K
	L

[编辑] 嵌套表格

{| border=1
|原有
|
{| style="background:blue; color:white" border=2
|插入
|-
|表格
|}
|表格
|}

生成：

原有

插入

表格

[编辑] 带颜色的表格

有两种方法让表格里的字和背景出现颜色，下面是第一种：

{| border=1
| bgcolor=blue | <font color=yellow> 字黄背景蓝
| 没设定颜色
| style="background:red; color:yellow" | 字黄背景红
| 没设定颜色
|}

生成：

字黄背景蓝

没设定颜色

字黄背景红

没设定颜色

这种方法能指定单格的颜色和背景。如果要让一行、一列或一整个表格都是同样的颜色，则使用第二种方法：

{| style="background:yellow; color:blue" border=1
|- 
| 这行是
| 蓝字
| 黄背景
|- style="background:navy; color:white"
| 这行是
| 白字
| 深海蓝
|-
| 这行
| style="background:white" | 比较
| 不一样
|}

生成：

这行是	蓝字	黄背景
这行是	白字	深海蓝
这行	比较	不一样

像其他参数一样，颜色参数指定的优先顺序为：单格→一行(列)→整个表格。
HTML4.01制定16种颜色名称，附上16进位值如下所示：

black	#000000	silver	#c0c0c0	maroon	#800000	red	#ff0000
navy	#000080	blue	#0000ff	purple	#800080	fuchsia	#ff00ff
green	#008000	lime	#00ff00	olive	#808000	Yellow	#ffff00
teal	#008080	aqua	#00ffff	gray	#808080	white	#ffffff

请参见：色彩列表

[编辑] 设定行高与列宽

整个表格的行高(height)和列宽(width)，以及任意列的列宽可以进行设定。要设定任意行的行高，可以通过设定该行任意一个单元格的行高来实现。如果存在行、列的高、宽没有设定，那么表格的显示结果可能随浏览器的不同而不同。

{| style="width:75%; height:200px" border="1"
|- 
| abc
| def
| ghi
|- style="height:100px" 
| jkl
| style="width:200px" |mno
| pqr
|-
| stu
| vwx
| yz
|}

将得到这样的结果：

abc	def	ghi
jkl	mno	pqr
stu	vwx	yz

取自"http://www.foodbk.com/wiki/Wikipedia:%E4%BD%BF%E7%94%A8%E8%A1%A8%E6%A0%BC"

 表格可以让大量数据呈现出良好的视觉效果，是所有用户的重要排版功能之一。同时，表格的样式控制功能丰富，可以为高级用户提供页面布局的有效手段。
-从2003年12月8日起，MediaWiki采用了简化的表格控制符号取代[[HTML]]代码，使得表格的使用大为方便。在简化格式中同样可以使用表格样式控制参数。
+从2003年12月8日起，MediaWiki采用了简化的表格控制符号取代HTML代码，使得表格的使用大为方便。在简化格式中同样可以使用表格样式控制参数。
 ==基础用法==
 :注意：'''表格控制符必须在行首书写！'''非行首表格代码将不被认可
 *单元格内容可包含链接、图片等，以及嵌套内部表格。
-:（规则表格写法简单；行或列重单元格数量不同意的不规则表格制作需要了解colspan、rowspan命令，这是[[html]]内容）
+:（规则表格写法简单；行或列重单元格数量不同意的不规则表格制作需要了解colspan、rowspan命令，这是html内容）
-*[[mediawiki]]的默认表格没有边框，如果需要的话需添加参数。（见下文介绍）
+*mediawiki的默认表格没有边框，如果需要的话需添加参数。（见下文介绍）
 *<nowiki>border="1" cellspacing="0"</nowiki> 是边框样式，不写的话就不出边框
 ==表格语法详解==
-在[[MediaWiki]]中，表格代码实际可以完全按[[HTML]]规范进行书写。具体的[[HTML]]表格介绍请参考相关[[HTML]]资料，下面说明[[MediaWiki]]表格控制符与[[HTML]]代码的对应关系
+在MediaWiki中，表格代码实际可以完全按[[HTML]]规范进行书写。具体的[[HTML]]表格介绍请参考相关[[HTML]]资料，下面说明MediaWiki表格控制符与[[HTML]]代码的对应关系
 === 表格控制符table ===
 |align="center" style="background:#ffffff; color:#000000; font-family:monospace;"|#ffffff
 |}
-''请参见：[[色彩列表]]''
+''请参见：色彩列表''
 ===设定行高与列宽===

Wikipedia:使用表格

取自食品百科全书

当前修订版本

目录

[编辑] 基础用法

[编辑] 基础范例

[编辑] 表格语法详解

[编辑] 表格控制符table

[编辑] 单元格控制符td

[编辑] 表头控制符th

[编辑] 新行控制符tr

[编辑] 标题控制符caption

[编辑] 复杂的例子

[编辑] 嵌套表格

[编辑] 带颜色的表格

[编辑] 设定行高与列宽

查看

个人工具

导航

搜索

工具箱

Wikipedia:使用表格

取自 食品百科全书

当前修订版本

目录

[编辑] 基础用法

[编辑] 基础范例

[编辑] 表格语法详解

[编辑] 表格控制符table

[编辑] 单元格控制符td

[编辑] 表头控制符th

[编辑] 新行控制符tr

[编辑] 标题控制符caption

[编辑] 复杂的例子

[编辑] 嵌套表格

[编辑] 带颜色的表格

[编辑] 设定行高与列宽

查看

个人工具

导航

搜索

工具箱

取自食品百科全书