Sign In  Not a member? Sign Up  Feedback
The WikiMarkup used in ScrewTurn Wiki supports tables, using a well-known syntax. Inserting tables is simple, but you can also modify the appearance of the tables.


Edit

1 - Basic Tables

A simple table is composed by a sequence of rows, and each row contains some cells.

{|
| Cell 1.1
| Cell 1.2
|-
| Cell 2.1
| Cell 2.2
|}

will results in

Cell 1.1  Cell 1.2 
Cell 2.1  Cell 2.2 

Depending on the theme you are using, tables' appearance might differ.
The same results can be obtained using the form

{|
| Cell 1.1 || Cell 1.2
|-
| Cell 2.1 || Cell 2.2
|}

As you can see, a table starts with {| and ends with |}. A single pipe starts a cell of the table, while a pipe with a hyphen (|-) starts a new row in the table. A double pipe separates two or more cells in the same row.

Edit

2 - Advanced Options

A table can have a caption (or title). You can specify it using a pipe and plus, just after the opening tag.

{|
|+ This is a Table
| Cell 1.1 || Cell 1.2
|-
| Cell 2.1 || Cell 2.2
|}

produces

This is a Table
Cell 1.1 Cell 1.2 
Cell 2.1 Cell 2.2 

You can also use row and cell headers; they are identified with a exclamation mark.

{|
! Cells x.1 !! Cells x.2
|-
| Cell 1.1 || Cell 1.2
|-
| Cell 2.1 || Cell 2.2
|}

generates

Cells x.1 Cells x.2 
Cell 1.1 Cell 1.2 
Cell 2.1 Cell 2.2 

You can use row headers as well.

{|
! X !! x.1 !! x.2
|-
! 1.x
| Cell 1.1 || Cell 1.2
|-
! 2.x
| Cell 2.1 || Cell 2.2
|}

generates

x.1 x.2 
1.x  Cell 1.1 Cell 1.2 
2.x  Cell 2.1 Cell 2.2 

Edit

3 - Table Appearance

You can modify the appearance of a table (and each row or cell) using XHTML tags.

{| border="1" bgcolor="Gray"
| Cell 1.1 || Cell 1.2
|-
| Cell 2.1 || Cell 2.2
|}

generates

Cell 1.1 Cell 1.2 
Cell 2.1 Cell 2.2 

You can also modify the appearance of single rows. In this case, you can add a trailing row separator manually.

{| cellspacing="0" cellpadding="2" border="1"
|- style="background-color: Red; color: White;"
| Cell 1.1 || Cell 1.2
|- style="font-weight: bold;"
| Cell 2.1 || Cell 2.2
|}

results in

Cell 1.1 Cell 1.2 
Cell 2.1 Cell 2.2 

Even single cells can be styled.

{|
| bgcolor="Blue" | Styled Cell
| Normal cell
|-
| Normal cell
| bgcolor="Yellow" | Styled cell
|}

Styled Cell  Normal cell 
Normal cell Styled cell 

Edit

4 - Merging Cells

You can use XHTML attributes to merge two or more cells (horizontally or vertically).
Note: not all the the browsers support this feature.

{|
| colspan="2" bgcolor="Red" | Cell
|-
| Cell || Cell
|}

generates

Cell 
Cell Cell 

While

{|
| rowspan="2" bgcolor="Red" | Cell
| Cell
|-
| Cell
|}

results in

Cell  Cell 
Cell 

Edit

5 - Alignment

You can align a table to the right or place it in the center of the page.

{| align="right" border="1"
| Cell || Cell
|}

produces

Cell Cell 

while

{| style="margin: 0px auto;" border="1"
| Cell || Cell
|}

results in

Cell Cell 

Edit

6 - All Together



{| cellspacing="0" cellpadding="2" style="background-color: #EEEEEE;"
|+ Styled Table
|- style="background-color: #990000; color: #FFFFFF;"
| This is a cell || This is a cell || This is a cell
|-
| style="background-color: #000000; color: #CCCCCC;" | Styled cell
| style="border: solid 1px #FF0000;" | Styled cell
| '''Normal cell'''
|-
| Normal || Normal || [Download]
|}

produces

Styled Table
This is a cell This is a cell This is a cell 
Styled cell Styled cell  Normal cell 
Normal Normal Download 
Tags for "Table"

Comments

Add your comment of "Table"

About this wiki

Learn English
using English

404 views