Help:Editing Tables

From Camera-wiki.org
Revision as of 14:41, 30 December 2022 by Ivanbranco (talk | contribs) (deleted 404 site)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search

Tables

The "code"

{|
| row 1, cell 1
| row 1, cell 2
|-
| row 2, cell 1
| row 2, cell 2
|}

produces

row 1, cell 1 row 1, cell 2
row 2, cell 1 row 2, cell 2

. Open the same table code with

{|class="wikitable"
|+caption
! Header 1
! Header 2
|-

instead with "{|", and You will receive a nicely designed table with borders, headers and caption:

caption
Header 1 Header 2
row 1, cell 1 row 1, cell 2
row 2, cell 1 row 2, cell 2

refined table design

Is more control needed? Then let’s replace the initial “|” of the table fields with "||". Between the two upright lines normal HTML attributes can be applied for alignment, background color and more. The general attributes for the whole table are just added after the table's initial "{|". The general attributes for just one line must be added after the roe's initial "|-".

{|class="toccolours" border="1" style="clear:both; background-color:#e0e0e0; margin:2em auto; text-align:center; border-collapse:collapse;"
! longer Header 1
! longer Header 2
! longer Header 3
|-
| style="background-color:yellow; " | row 1<br />cell 1
| valign=bottom style="background-color:lightpink; " | row 1 cell 2
| valign=middle rowspan=2 | high cell
|-
| align=left style="background-color:lightgreen; " | row 2 cell 1
| align=right style="background-color:cyan; " | row 2 cell 2
|-style="background-color:#d0d0d0; "
| colspan=2 | wide cell
|| row 3 cell 2

|}

The result is now:

longer Header 1 longer Header 2 longer Header 3
row 1
cell 1
row 1 cell 2 high cell
row 2 cell 1 row 2 cell 2
wide cell row 3 cell 2

Hint: XHTML attributes like style="background-color:..." should be prefered in favour of deprecated attributes like bgcolor.