Help:Broken/\xe8\xa1\xa8\xe3\x3f\xae\xe4\xbd\x9c\xe3\x82\x8a\xe6\x96\xb9

English

MediaWikiユーザーズガイド

1. HTML
2. Wiki-td
3. パイプ文法

[[]]

==

{| params
|}

|+ Caption

|- params 

<td>cell1</td>
<td>cell2</td>

<td>cell1
<td>cell2

| cell1
| cell2

<table>
<tr>
<td>Cell 1, row 1</td>
<td>Cell 2, row 1</td>
</tr> 
<tr>
<td>Cell 1, row 2</td> 
<td>Cell 2, row 2</td> 
</tr>
</table>

<table>
<tr>
<td>Cell 1, row 1 
<td>Cell 2, row 1 
<tr>
<td>Cell 1, row 2 
<td>Cell 2, row 2 
</table>

{|
| Cell 1, row 1 
| Cell 2, row 1 
|- 
| Cell 1, row 2 
| Cell 2, row 2 
|}

<table>
<tr> <td>1</td> <td>2</td> </tr> 
<tr> <td>3</td> <td>4</td> </tr>
<tr> <td>5</td> <td>6</td> </tr>
</table>

<table>
<tr><td>1<td>2 
<tr><td>3<td>4 
<tr><td>4<td>5 
</table>

{|
| 1 || 2 
|- 
| 3 || 4 
|- 
| 4 || 5 
|}

Introduction to tables

Example table

Source code

<table border="1" cellpadding="2">
<caption>Multiplication table</caption>
<tr><th>&times;</th><th>1</th><th>2</th><th>3</th></tr>
<tr><th>1</th><td>1</td><td>2</td><td>3</td></tr>
<tr><th>2</th><td>2</td><td>4</td><td>6</td></tr>
<tr><th>3</th><td>3</td><td>6</td><td>9</td></tr>
<tr><th>4</th><td>4</td><td>8</td><td>12</td></tr>
<tr><th>5</th><td>5</td><td>10</td><td>15</td></tr>
</table>

What it looks like in your browser

Multiplication table

×	1	2	3
1	1	2	3
2	2	4	6
3	3	6	9
4	4	8	12
5	5	10	15

The important things to note in the example:

• The entire table begins with <table ...> and ends with the required </table>
• A Caption is a succinct way to describe your table, and should go inside the caption element just after the initial <table> tag
• Table rows are horizontal groups of cells in the table. They begin with <tr> and end with the optional </tr>
• Table headings are cells with headings in them, and are often rendered in a bold font. They begin with <th> and end with the optional </th>
• Table data cells fill out the rest of the table. They begin with <td> and end with the optional </td>

The td and th elements are sometimes called "cells", somewhat like the cells in a spreadsheet. Each row must have the same number of cells as the other rows, so that the number of columns in the table remains consistent (unless there are cells which span several columns or rows, but this is not discussed here). For empty cells, use the non-breaking space " " as content, otherwise some browsers may not format the table properly.

If your table doesn't look right, make sure that all of the HTML tags are properly nested. You may find it easier to leave out the optional closing tags for some elements, since they are not strictly required in HTML. The best way to find errors in your table, though, is to check the article using the W3C MarkUp Validation Service. Simply copy the URL of your article and paste it into the validator's address box. This service is especially useful for large, complex tables that would be difficult to check visually.

If you are already familiar with HTML tables, you may want to note that the thead, tbody, tfoot, and colgroup elements are currently unsupported in Wikipedia.

Sample in <td> code

The sample above without the optional closing tags looks as follows:

<table border="1" cellpadding="2">
<caption>Multiplication table</caption>
<tr><th>&times;<th>1<th>2<th>3
<tr><th>1<td>1<td>2<td>3
<tr><th>2<td>2<td>4<td>6
<tr><th>3<td>3<td>6<td>9
<tr><th>4<td>4<td>8<td>12
<tr><th>5<td>5<td>10<td>15
</table>

Besides being shorter, this makes the page easier to maintain and less error-prone.

Another example

Here's a more advanced example, showing some more options available for making up tables. You can play with these settings in your own table to see what effect they have. Not all of these techniques may be appropriate in all cases; just because you can add colored backgrounds, for example, doesn't mean it's always a good idea. Try to keep the markup in your tables relatively simple -- remember, other people are going to be editing the article too! This example should give you an idea of what is possible, though.

Source code

<table border="1" cellpadding="5" cellspacing="0" align="center">
<caption>'''An example table'''</caption>
<tr>
<th style="background:#efefef;">First header</th>
<th colspan="2" style="background:#ffdead;">Second header</th>
</tr>
<tr>
<td>upper left</td>
<td> </td>
<td rowspan=2 style="border-bottom:3px solid grey;" valign="top">
right side</td>
</tr>
<tr>
<td style="border-bottom:3px solid grey;">lower left</td>
<td style="border-bottom:3px solid grey;">lower middle</td>
</tr>
<tr>
<td colspan="3" align="center">
<table border="0">
<caption>''A table in a table''</caption>
<tr>
<td align="center" width="150px">[[Image:wiki.png]]</td>
<td align="center" width="150px">[[Image:wiki.png]]</td>
</tr>
<tr>
<td align="center" colspan="2" style="border-top:1px solid red; 
border-right:1px solid red; border-bottom:2px solid red; 
border-left:1px solid red;">
Two Wikipedia logos</td>
</tr>
</table>
</td>
</tr>
</table>

What it looks like in your browser

An example table

First header	Second header
upper left		right side
lower left	lower middle
A table in a table Two Wikipedia logos

Yet Another Example

Here is a sample in the pipe-code, that may be simpler than the usual HTML. The source is somewhat longer (10-20%) than the wiki-<td> version.

Source code

{| border="1" cellpadding="2"
!Name:
!Effect:
!Games Found In
|-
|Pokeball
|Regular Pokeball
|All Versions
|-
|Great Ball
|Better than a Pokeball
|All Versions
|-
|Ultra Ball
|Better than a Great Ball
|All Versions
|-
|Master Ball
|Catches any Pokémon without fail.
|All Versions
|}

What it looks like in your browser

Name:	Effect:	Games Found In
Pokeball	Regular Pokeball	All Versions
Great Ball	Better than a Pokeball	All Versions
Ultra Ball	Better than a Great Ball	All Versions
Master Ball	Catches any Pokémon without fail.	All Versions

Guide to the pipe syntax

The pipe syntax, developed by Magnus Manske, substitutes pipes (|) for HTML or the simplified <table>, <tr>, <td>, <th>, and <caption> tags.

The pipes must start at the beginning of a new line (with one exception). The parameters are optional.

Table

A table is defined by {| ''params'' |} which equals <table ''params''>Insert non-formatted text here </table>

Careful: You must include the space between {| and params, or the first parameter gets ignored.

TD

Cells are generated either like this:

|cell1
|cell2
|cell3

or like this:

|cell1||cell2||cell3

which both equal

<td>cell1</td><td>cell2</td><td>cell3</td>

so "||" equals "newline"+"|"

Parameters in cells can be used like this:

|params|cell1

which will result in

<td params>

TH

Functions the same way as TD, except "!" is used instead of the opening "|". "!!" can be used instead of "||". Parameters still use "|", though! Example:

!params|cell1

TR

<tr> tags will be generated automatically for the first row. To start a new row, use

|-

which results in

<tr>

Parameters can be added like this:

|- params

which results in

<tr params>

Note:

• <tr> tags will be automatically opened at the first <td> equivalent
• <tr> tags will be automatically closed at <tr> and </table> equivalents

CAPTION

A <caption> tag is created by

|+ Caption

which generates

<caption>Caption</caption>

You can also use parameters:

|+ params|Caption

which will generate

<caption params>Caption

Examples

Simple example

 
 {| 
 | Cell 1, row 1 
 | Cell 2, row 1 
 |- 
 | Cell 1, row 2 
 | Cell 2, row 2 
 |}

generates

Advanced example

 {| align=right border=1
 | Cell 1, row 1 
 |rowspan=2| Cell 2, row 1 (and 2) 
 | Cell 3, row 1 
 |- 
 | Cell 1, row 2 
 | Cell 3, row 2 
 |}

Note the floating table to the right.

Nested table

 {| border=1
 | blabla
 |
 {| bgcolor=#ABCDEF border=2
 |nested
 |-
 |table
 |}
 |the original table again
 |}

gives a nested table

Caption and multi-cell-lines

{| border=1 align=right
|+ '''This is the caption.''' Example taken from Afghanistan table.
|[[Independence]]||[[August 19]], [[1919]]
|-
|[[Currency]]||[[Afghani]]
|-
|[[Time zone]]||[[UTC]]+4:30
|-
|[[National anthem]]||[[Sououd-e-Melli]]
|-
|[[Top-level domain|Internet TLD]]||.af
|}

is shown on the right.

Header test

made by

 {| border=1
 ! Header1!! Header2
 |-
 | Cell1|| Cell2
 |}

TR test

 {|
 | cell1 || cell2
 |- bgcolor=#abcdef
 | cell3 || cell4
 |}

makes

Test for rows with mixed headers and body text

 {| border=1 cellspacing=0
 ! 
 ! col Header1 
 ! ch2 
 |-
 ! row header 3
 | abc def ghi 
 |   gchf ghh dfgh
 |-
 ! RH 4
 | gfbb gbgbds 
 |    dfgsdsdg
 |}

makes:

but:

 {| border=1 cellspacing=0
 !   !! col Header1 !! ch2 
 |-
 ! row header 3 || abc def ghi ||   gchf ghh dfgh
 |-
 ! RH 4         || gfbb gbgbds ||    dfgsdsdg
 |-
 ! RH 5         ||             ||    
 |}

makes:

See also

• [[]]
• de:Wikipedia:Tabellen (deutsch)
• eo:Vikipedio:Vikitabeloj (esperanto)
• fr:Wikipédia:Syntaxe wikipédia/tableaux (français)
• en:Wikipedia:How to use tables

次ページ: EasyTimeline >