How To Use Tables: Difference between revisions
imported>Tlosk No edit summary |
imported>Tlosk mNo edit summary |
||
(7 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
{{Related|Help:Contents{{!}}Main Help|wikipedia:Help:Table{{!}}Wikipedia Tables}} | |||
__TOC__ | |||
{| | == A Simple Example == | ||
=== Basic Table Wiki Markup === | |||
=== Wikitable Class === | |||
The "wikitable" class provides a nice looking table without having to remember or specify all the details each time you create a table. This is because the wikitable class in [[MediaWiki:Common.css]] contains a number of table.wikitable CSS style rules. These are all applied at once when you mark a table with this class. You can then add additional style rules if desired. These override the class's rules, allowing you to use the class style as a base and build up on it. | |||
{|cellpadding=20 | |||
|-valign=top | |||
|'''Code:'''<br> | |||
<pre style="width:160px"> | |||
{|class="wikitable" | |||
!A | |||
!B | |||
|- | |||
|100 | |||
|200 | |||
|} | |||
</pre> | |||
|'''Result:'''<br> | |||
{|class="wikitable" | |||
!A | |||
!B | |||
|- | |||
|100 | |||
|200 | |||
|} | |||
|} | |||
== Colors == | |||
== Cell Borders == | |||
== Alignment == | |||
== Sorting == | |||
Tables can be made sortable by adding <code>class="sortable"</code>. For more details see [[wikipedia:Help:Sorting|Help:Sorting]]. If the table already has a class qualifier add sortable separated by a space, for example <code>class="wikitable sortable"</code>. | |||
{|cellpadding=20 | |||
|-valign=top | |-valign=top | ||
| | |'''Code:'''<br> | ||
<pre style="width:240px"> | |||
{|class="wikitable sortable" | |||
!A !!B !!C | |||
| | |||
|- | |- | ||
|500 ||200 ||Cat | |||
|- | |||
|300 ||400 ||Aardvark | |||
|- | |||
|100 ||50 ||Yak | |||
|- | |||
|} | |||
</pre> | |||
|'''Result:'''<br> | |||
{|class="wikitable sortable" | |||
!A !!B !!C | |||
|- | |||
|500 ||200 ||Cat | |||
|- | |||
|300 ||400 ||Aardvark | |||
|- | |||
|100 ||50 ||Yak | |||
|- | |||
|} | |||
|} | |||
== Captions == | |||
== Nested Tables == | |||
== Colspan and Rowspan == | |||
== Frames == | |||
This example demonstrates how to use the "frame" attribute to control the borders around a table. The thickness of the lines can be specified using "border" and the width in pixels. The frame feature is only supported in modern browsers. The first nine examples change only the frame parameter, the last three also change the border: | |||
<pre style="width:160px; align=center"> | |||
{|frame="??" | |||
!A | |||
!B | |||
|- | |||
|100 | |||
|200 | |||
|} | |||
</pre> | |||
{|cellpadding=20 | |||
|-align=center | |||
|frame="border"<br><br> | |||
{|frame="border" | |||
!A | |||
!B | |||
|- | |||
|100 | |||
|200 | |||
|} | |||
|frame="above"<br><br> | |||
{|frame="above" | |||
!A | |||
!B | |||
|- | |||
|100 | |||
|200 | |||
|} | |||
|frame="below"<br><br> | |||
{|frame="below" | |||
!A | |||
!B | |||
|- | |||
|100 | |||
|200 | |||
|} | |||
|-align=center | |||
|frame="hsides"<br><br> | |||
{|frame="hsides" | |||
!A | |||
!B | |||
|- | |||
|100 | |||
|200 | |||
|} | |||
|frame="vsides"<br><br> | |||
{|frame="vsides" | |||
!A | |||
!B | |||
|- | |||
|100 | |||
|200 | |||
|} | |||
|frame="lhs"<br><br> | |||
{|frame="lhs" | |||
!A | |||
!B | |||
|- | |||
|100 | |||
|200 | |||
|} | |||
|-align=center | |||
|frame="rhs"<br><br> | |||
{|frame="rhs" | |||
!A | |||
!B | |||
|- | |||
|100 | |||
|200 | |||
|} | |||
|frame="box"<br><br> | |||
{|frame="box" | |||
!A | |||
!B | |||
|- | |||
|100 | |||
|200 | |||
|} | |||
|frame="void"<br><br> | |||
{|frame="void" | |||
!A | |||
!B | |||
|- | |||
|100 | |||
|200 | |||
|} | |||
|-align=center | |||
|frame="border" border="3"<br><br> | |||
{|frame="border" border="3" | |||
!A | |||
!B | |||
|- | |||
|100 | |||
|200 | |||
|} | |||
|frame="hsides" border="2"<br><br> | |||
{|frame="hsides" border="2" | |||
!A | |||
!B | |||
|- | |||
|100 | |||
|200 | |||
|} | |||
|frame="vsides" border="3"<br><br> | |||
{|frame="vsides" border="3" | |||
!A | |||
!B | |||
|- | |||
|100 | |||
|200 | |||
|} | |||
|} | |} | ||
== Decimal Point Alignment == | |||
[[Category:Help]] | [[Category:Help]] | ||
[[Category:In Progress]] | [[Category:In Progress]] |
Latest revision as of 00:56, 31 March 2010
Related topics: Main Help, Wikipedia Tables
A Simple Example
Basic Table Wiki Markup
Wikitable Class
The "wikitable" class provides a nice looking table without having to remember or specify all the details each time you create a table. This is because the wikitable class in MediaWiki:Common.css contains a number of table.wikitable CSS style rules. These are all applied at once when you mark a table with this class. You can then add additional style rules if desired. These override the class's rules, allowing you to use the class style as a base and build up on it.
Code:{|class="wikitable" !A !B |- |100 |200 |} |
Result:
|
Colors
Cell Borders
Alignment
Sorting
Tables can be made sortable by adding class="sortable"
. For more details see Help:Sorting. If the table already has a class qualifier add sortable separated by a space, for example class="wikitable sortable"
.
Code:{|class="wikitable sortable" !A !!B !!C |- |500 ||200 ||Cat |- |300 ||400 ||Aardvark |- |100 ||50 ||Yak |- |} |
Result:
|
Captions
Nested Tables
Colspan and Rowspan
Frames
This example demonstrates how to use the "frame" attribute to control the borders around a table. The thickness of the lines can be specified using "border" and the width in pixels. The frame feature is only supported in modern browsers. The first nine examples change only the frame parameter, the last three also change the border:
{|frame="??" !A !B |- |100 |200 |}
frame="border"
|
frame="above"
|
frame="below"
| ||||||||||||
frame="hsides"
|
frame="vsides"
|
frame="lhs"
| ||||||||||||
frame="rhs"
|
frame="box"
|
frame="void"
| ||||||||||||
frame="border" border="3"
|
frame="hsides" border="2"
|
frame="vsides" border="3"
|