Help:Introduction to tables with Wiki Markup/Old advanced formatting page
Introduction to tables
How and why
Editing tables
The basics
Expanding tables
Adding rows and columns
Summary
Review of what you've learned
.
Property | Meaning | Example |
---|---|---|
background | back ground fill | background: yellow;
|
color | text colour | color: blue;
|
width | cell width | width: 100px;
|
border-width | border width | border-width: 3px;
|
text-align | Text alignment within cell | text-align: center;
|
As an example, here's an example with some varied formatting added to specific cells
{| class="wikitable" |+ Caption: some cells yellow. |- ! Header1 ! Header2 ! Header3 |- | style="background: yellow" | R1C1 | R1C2 | style="background: yellow" | R1C3 |- | R2C1 | style="background: yellow" | R2C2 | R2C3 |}
Then it would produce this:
Header1 | Header2 | Header3 |
---|---|---|
R1C1 | R1C2 | R1C3 |
R2C1 | R2C2 | R2C3 |
HTML attributes can be added to the whole table by editing the first line of the table using {| style=" "
in the first line. Similarly, attributes can be added to a row using |- style=" "
The example below would fill the whole table yellow.
{| class="wikitable" style="background: yellow"
All of these formatting options should be used sparingly. Tables in crazy colours are hard to read.
Hidden comments
In complicated tables, sometimes hidden comments can be useful to explain formatting. These hidden comments are only visible when editing the page, not when reading it normally. Comments can be added by placing them between <!--
and -->
.
| R1C1 || R1C2 ||R1C3 <!-- Hidden comment to explain this row -->