Tables

Short Description
Demonstrates on how you can create simple and advanced tables

Simple tables

You can create simple tables using pairs of vertical bars:

||~ head 1 ||~ head 2 ||~ head 3 ||
|| cell 1 || cell 2 || cell 3 ||
|||| long cell 4 || cell 5 ||
||cell 6 |||| long cell 7 ||
|||||| looong cell 8||
head 1 head 2 head 3
cell 1 cell 2 cell 3
long cell 4 cell 5
cell 6 long cell 7
looong cell 8
|| lines must start and end || with double vertical bars || nothing ||
|| cells are separated by || double vertical bars || nothing ||
|||| you can span multiple columns by || starting each cell ||
|| with extra cell |||| separators ||
|||||| but perhaps an example is _
the easiest way to see ||
lines must start and end with double vertical bars nothing
cells are separated by double vertical bars nothing
you can span multiple columns by starting each cell
with extra cell separators
but perhaps an example is
the easiest way to see

For a new line inside the table cell use _ (underscore) at the end of the line (see the example above).

Advanced (custom) tables

To create more advanced tables, special tags can be used that can accept class and style attributes for managing appearance. To create an advanced table use the following syntax:

[[table]]
[[row]]
[[cell style="border: 1px solid silver; background-color: yellow;"]]
cell 0.0
[[/cell]]
[[cell style="border: 1px solid silver"]]
cell 0.1
[[/cell]]
[[/row]]
[[row style="border: 1px solid silver"]]
[[cell]]
cell 1.0
[[/cell]]
[[cell style="border: 1px solid silver; background-color: yellow;"]]
cell 1.1
[[/cell]]
[[/row]]
[[/table]]

transforms to…

cell 0.0 cell 0.1
cell 1.0 cell 1.1

Each of elements [[table]], [[row]] and [[cell]] can accept attributes style and class and they are transformed to (X)HTML tags: <table>, <tr> and <td>.

An example of using tables for page layout can be found on our Snippets Wiki at: http://snippets.wikidot.com/code:layout-with-tables .

Tables can be nested.

Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-ShareAlike 3.0 License