Pure CSS tables
Pure CSS tables are created with the
woof::pure::table
and have several associated styling options.
The default table layout is shown below. The table data is provided as the first argument in the form of a nested list each element of which is a sublist containing a row with each element of the sublist being a cell.
[::woof::pure::table {
{{Row1 Col1} {Row1 Col2} {Row1 Col3}}
{{Row2 Col1} {Row2 Col2} {Row2 Col3}}
}]
| Row1 Col1 | Row1 Col2 | Row1 Col3 |
| Row2 Col1 | Row2 Col2 | Row2 Col3 |
An optional heading can be specified with the -heading option.
[::woof::pure::table {
{{Row1 Col1} {Row1 Col2} {Row1 Col3}}
{{Row2 Col1} {Row2 Col2} {Row2 Col3}}
} -heading {{Column 1} {Column 2} {Column 3}}]
| Column 1 | Column 2 | Column 3 |
|---|---|---|
| Row1 Col1 | Row1 Col2 | Row1 Col3 |
| Row2 Col1 | Row2 Col2 | Row2 Col3 |
The -borders option controls table borders. For example,
specifying a value of horizontal displays borders only between
rows.
[::woof::pure::table {
{{Row1 Col1} {Row1 Col2} {Row1 Col3}}
{{Row2 Col1} {Row2 Col2} {Row2 Col3}}
} -borders horizontal]
| Row1 Col1 | Row1 Col2 | Row1 Col3 |
| Row2 Col1 | Row2 Col2 | Row2 Col3 |
Alternatively, rows can be striped.
[::woof::pure::table {
{{Row1 Col1} {Row1 Col2} {Row1 Col3}}
{{Row2 Col1} {Row2 Col2} {Row2 Col3}}
} -heading {{Column 1} {Column 2} {Column 3}} -stripes 1]
| Column 1 | Column 2 | Column 3 |
|---|---|---|
| Row1 Col1 | Row1 Col2 | Row1 Col3 |
| Row2 Col1 | Row2 Col2 | Row2 Col3 |