Difference between revisions of "Help:How to make tables"
Line 1: | Line 1: | ||
− | Tables can help you put a lot of information in to a concentrated space. They are a little bit difficult to make so only read this if you are already farmiliar with how text formatting works. To start a table make a line with just {| and nothing else | + | Tables can help you put a lot of information in to a concentrated space. They are a little bit difficult to make so only read this if you are already farmiliar with how text formatting works. To start a table make a line with just {| and nothing else. On the next line put a | which means you are making a cell in the first row and put the contents of that cell on the rest of the line. On the next line put an other | and the contents of the second cell. Make as many cells in a row as you want using more lines starting with|. To start the second row put |- on the next line to signify a new row. Think of it as making a table row by row. To finish the table make a line at the end with |}. Below you can see an example of what you would type to make a table and what it makes in the article. |
==A simple table== | ==A simple table== | ||
{|width="100%" | {|width="100%" | ||
!You type | !You type | ||
!You get | !You get | ||
− | |||
|width="50%"| | |width="50%"| | ||
<pre> | <pre> | ||
{| | {| | ||
− | |||
|''Cabin'' | |''Cabin'' | ||
|''Number of campers'' | |''Number of campers'' | ||
Line 27: | Line 25: | ||
|width="50%"| | |width="50%"| | ||
{| | {| | ||
− | |||
|''Cabin'' | |''Cabin'' | ||
|''Number of campers'' | |''Number of campers'' | ||
Line 51: | Line 48: | ||
!You type | !You type | ||
!You get | !You get | ||
− | |||
|width="50%"| | |width="50%"| | ||
<pre> | <pre> | ||
{| | {| | ||
− | |||
!Cabin | !Cabin | ||
!Campers | !Campers | ||
− | |||
|Cabin 1 | |Cabin 1 | ||
|4 | |4 | ||
Line 74: | Line 68: | ||
|width="50%"| | |width="50%"| | ||
{| | {| | ||
− | |||
!Cabin | !Cabin | ||
!Campers | !Campers | ||
− | |||
|Cabin 1 | |Cabin 1 | ||
|4 | |4 | ||
Line 95: | Line 87: | ||
!You type | !You type | ||
!You get | !You get | ||
− | |||
|width="50%"| | |width="50%"| | ||
<pre> | <pre> | ||
{| | {| | ||
− | |||
!Name | !Name | ||
|Adric Allie | |Adric Allie | ||
Line 113: | Line 103: | ||
|width="50%"| | |width="50%"| | ||
{| | {| | ||
− | |||
!Name | !Name | ||
|Adric Allie | |Adric Allie | ||
Line 129: | Line 118: | ||
!You type | !You type | ||
!You get | !You get | ||
− | |||
|width="50%"| | |width="50%"| | ||
<pre> | <pre> | ||
Line 138: | Line 126: | ||
!3 | !3 | ||
!4 | !4 | ||
− | |||
!1 | !1 | ||
|1 | |1 | ||
Line 171: | Line 158: | ||
!3 | !3 | ||
!4 | !4 | ||
− | |||
!1 | !1 | ||
|1 | |1 | ||
Line 197: | Line 183: | ||
|} | |} | ||
|} | |} | ||
− | |||
==Borders== | ==Borders== | ||
To make borders you place a border attibute in the first line of the table after the {| like this {|border="1". You can see an example of this below. | To make borders you place a border attibute in the first line of the table after the {| like this {|border="1". You can see an example of this below. | ||
Line 203: | Line 188: | ||
!You type | !You type | ||
!You get | !You get | ||
− | |||
|width="50%"| | |width="50%"| | ||
<pre> | <pre> | ||
{|border="1" | {|border="1" | ||
− | + | !Cabin | |
− | + | !Campers | |
− | |||
− | |||
|Cabin 1 | |Cabin 1 | ||
|4 | |4 | ||
Line 226: | Line 208: | ||
|width="50%"| | |width="50%"| | ||
{|border="1" | {|border="1" | ||
− | + | !Cabin | |
− | + | !Campers | |
− | |||
− | |||
|Cabin 1 | |Cabin 1 | ||
|4 | |4 | ||
Line 249: | Line 229: | ||
!You type | !You type | ||
!You get | !You get | ||
− | |||
|width="50%"| | |width="50%"| | ||
<pre> | <pre> | ||
{|align="right" border="1" | {|align="right" border="1" | ||
− | + | !Cabin | |
− | + | !Campers | |
− | |||
− | |||
|Cabin 1 | |Cabin 1 | ||
|4 | |4 | ||
Line 272: | Line 249: | ||
|width="50%"| | |width="50%"| | ||
{|align="right" border="1" | {|align="right" border="1" | ||
− | + | !Cabin | |
− | + | !Campers | |
− | |||
− | |||
|Cabin 1 | |Cabin 1 | ||
|4 | |4 | ||
Line 293: | Line 268: | ||
!You type | !You type | ||
!You get | !You get | ||
− | |||
|width="50%"| | |width="50%"| | ||
<pre> | <pre> | ||
{|align="center" border="1" | {|align="center" border="1" | ||
− | + | !Cabin | |
− | + | !Campers | |
− | |||
− | |||
|Cabin 1 | |Cabin 1 | ||
|4 | |4 | ||
Line 316: | Line 288: | ||
|width="50%"| | |width="50%"| | ||
{|align="center" border="1" | {|align="center" border="1" | ||
− | + | !Cabin | |
− | + | !Campers | |
− | |||
− | |||
|Cabin 1 | |Cabin 1 | ||
|4 | |4 | ||
Line 339: | Line 309: | ||
!You type | !You type | ||
!You get | !You get | ||
− | |||
|width="50%"| | |width="50%"| | ||
<pre> | <pre> | ||
{|border="1" | {|border="1" | ||
|+Birch Rock cabins | |+Birch Rock cabins | ||
− | + | !Cabin | |
− | + | !Campers | |
− | |||
− | |||
|Cabin 1 | |Cabin 1 | ||
|4 | |4 | ||
Line 364: | Line 331: | ||
{|border="1" | {|border="1" | ||
|+Birch Rock cabins | |+Birch Rock cabins | ||
− | + | !Cabin | |
− | + | !Campers | |
− | |||
− | |||
|Cabin 1 | |Cabin 1 | ||
|4 | |4 | ||
Line 390: | Line 355: | ||
{|border="1" | {|border="1" | ||
|+align="bottom"|Birch Rock cabins | |+align="bottom"|Birch Rock cabins | ||
− | + | !Cabin | |
− | + | !Campers | |
− | |||
− | |||
|Cabin 1 | |Cabin 1 | ||
|4 | |4 | ||
Line 410: | Line 373: | ||
{|border="1" | {|border="1" | ||
|+align="bottom"|Birch Rock cabins | |+align="bottom"|Birch Rock cabins | ||
− | + | !Cabin | |
− | + | !Campers | |
− | |||
− | |||
|Cabin 1 | |Cabin 1 | ||
|4 | |4 | ||
Line 433: | Line 394: | ||
!You type | !You type | ||
!You get | !You get | ||
− | |||
|width="50%"| | |width="50%"| | ||
<pre> | <pre> | ||
{|border="1" style="color:green;" | {|border="1" style="color:green;" | ||
− | + | !Cabin | |
− | + | !Campers | |
− | |||
− | |||
|Cabin 1 | |Cabin 1 | ||
|4 | |4 | ||
Line 456: | Line 414: | ||
|width="50%"| | |width="50%"| | ||
{|border="1" style="color:green;" | {|border="1" style="color:green;" | ||
− | + | !Cabin | |
− | + | !Campers | |
− | |||
− | |||
|Cabin 1 | |Cabin 1 | ||
|4 | |4 | ||
Line 477: | Line 433: | ||
!You type | !You type | ||
!You get | !You get | ||
− | |||
|width="50%"| | |width="50%"| | ||
<pre> | <pre> | ||
{|border="1" style="background-color:blue;" | {|border="1" style="background-color:blue;" | ||
− | + | !Cabin | |
− | + | !Campers | |
− | |||
− | |||
|Cabin 1 | |Cabin 1 | ||
|4 | |4 | ||
Line 500: | Line 453: | ||
|width="50%"| | |width="50%"| | ||
{|border="1" style="background-color:blue;" | {|border="1" style="background-color:blue;" | ||
− | + | !Cabin | |
− | + | !Campers | |
− | |||
− | |||
|Cabin 1 | |Cabin 1 | ||
|4 | |4 | ||
Line 521: | Line 472: | ||
!You type | !You type | ||
!You get | !You get | ||
− | |||
|width="50%"| | |width="50%"| | ||
<pre> | <pre> | ||
{|border="1" style="color:orange;background-color:blue;" | {|border="1" style="color:orange;background-color:blue;" | ||
− | + | !Cabin | |
− | + | !Campers | |
− | |||
− | |||
|Cabin 1 | |Cabin 1 | ||
|4 | |4 | ||
Line 544: | Line 492: | ||
|width="50%"| | |width="50%"| | ||
{|border="1" style="color:orange;background-color:blue;" | {|border="1" style="color:orange;background-color:blue;" | ||
− | + | !Cabin | |
− | + | !Campers | |
− | |||
− | |||
|Cabin 1 | |Cabin 1 | ||
|4 | |4 |
Revision as of 00:57, 20 January 2008
Tables can help you put a lot of information in to a concentrated space. They are a little bit difficult to make so only read this if you are already farmiliar with how text formatting works. To start a table make a line with just {| and nothing else. On the next line put a | which means you are making a cell in the first row and put the contents of that cell on the rest of the line. On the next line put an other | and the contents of the second cell. Make as many cells in a row as you want using more lines starting with|. To start the second row put |- on the next line to signify a new row. Think of it as making a table row by row. To finish the table make a line at the end with |}. Below you can see an example of what you would type to make a table and what it makes in the article.
A simple table
You type | You get |
{| |''Cabin'' |''Number of campers'' |- |Cabin 1 |4 |- |Cabin 6 |4 |- |Eagle's Nest |8 |- |Buzzard's Roost |8 |} |
|
---|
To make the thing above I actually used a table. I made a row with a cell You type and a cell You get. Then I made a new row with a cell for the box with the code in it and a cell with a table inside it (you can put tables inside tables). Using a table was the only way I could have made it look like that. Tables can give you a lot of control over your page. As you can see, the table above does not have and lines between the cells. Read on to see how you can add atributes like this to tables.
Headers
You can make headers to rows or columns of a table or both.
Headers on columns
You type | You get |
{| !Cabin !Campers |Cabin 1 |4 |- |Cabin 6 |4 |- |Eagle's Nest |8 |- |Buzzard's Roost |8 |} |
|
---|
Headers on rows
You type | You get |
{| !Name |Adric Allie |Will Brewster |Teddy Brown |- !Seal time |1:28 |1:48 |1:32 |} |
|
---|
Headers on both
You type | You get |
{| ! !1 !2 !3 !4 !1 |1 |2 |3 |4 |- !2 |2 |4 |6 |8 |- !3 |3 |6 |9 |12 |- !4 |4 |8 |12 |16 |} |
|
---|
Borders
To make borders you place a border attibute in the first line of the table after the {| like this {|border="1". You can see an example of this below.
You type | You get |
{|border="1" !Cabin !Campers |Cabin 1 |4 |- |Cabin 6 |4 |- |Eagle's Nest |8 |- |Buzzard's Roost |8 |} |
|
---|
Justification
You can make a table appear on the right or middle of a page by using the align attribute like this: {|align="right". You can also set it to "center". If you want to make the table be in the center and have it have a border you can add multiple attributes to it like this: {|align="right" border="1". Below you can see some examples.
Right
You type | You get |
{|align="right" border="1" !Cabin !Campers |Cabin 1 |4 |- |Cabin 6 |4 |- |Eagle's Nest |8 |- |Buzzard's Roost |8 |} |
|
---|
Center
You type | You get |
{|align="center" border="1" !Cabin !Campers |Cabin 1 |4 |- |Cabin 6 |4 |- |Eagle's Nest |8 |- |Buzzard's Roost |8 |} |
|
---|
Captions
You can caption a table by adding an extra line after the first line. This line is started with |+ and then after that you put the caption.
On the top of the table
You type | You get |
{|border="1" |+Birch Rock cabins !Cabin !Campers |Cabin 1 |4 |- |Cabin 6 |4 |- |Eagle's Nest |8 |- |Buzzard's Roost |8 |} |
|
---|
On the bottom of the table
You type | You get | ||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|
{|border="1" |+align="bottom"|Birch Rock cabins !Cabin !Campers |Cabin 1 |4 |- |Cabin 6 |4 |- |Eagle's Nest |8 |- |Buzzard's Roost |8 |} |
|
Colors
You can make the text and border of a table a different color and the background of it a different color with the style attribute. After the {| in the first line you can add style="color:green;background-color:blue;" to make the text and borders green and the backround blue. Look below for examples.
Change the text and border color
You type | You get |
{|border="1" style="color:green;" !Cabin !Campers |Cabin 1 |4 |- |Cabin 6 |4 |- |Eagle's Nest |8 |- |Buzzard's Roost |8 |} |
|
---|
Change the background color
You type | You get |
{|border="1" style="background-color:blue;" !Cabin !Campers |Cabin 1 |4 |- |Cabin 6 |4 |- |Eagle's Nest |8 |- |Buzzard's Roost |8 |} |
|
---|
Change both the text and border color and the background color
You type | You get |
{|border="1" style="color:orange;background-color:blue;" !Cabin !Campers |Cabin 1 |4 |- |Cabin 6 |4 |- |Eagle's Nest |8 |- |Buzzard's Roost |8 |} |
|
---|