Tables - Tags
Table basics
<table></table>(w3c)
global attributes & border
Atable has an opening and closing tag
<tr></tr>
represent a table row which is the container for the cells
permitted parent table, thead, tfoot, tbody
<th></th>
Table headings an individual cell can include titles of rows and/or columns
permitted parent tr
Attribute: rowspan and colspan(see below)
<td></td>
td, table data is an individual cell
permitted parent tr
Attribute: rowspan and colspan
<td colspan="number">
A very basic table with two columns
<table>open table
<tr> open row
<th> title</th><th> title</th> titles/topics for two columns below
</tr> close row
<tr> open row
<td> data</td>
<td>data</td> first row of information
</tr> close row
<tr> open row
<td> data</td><td>data</td>secondrow of information
</tr> close row
</table> close table
| Title | Title |
|---|---|
| data | data |
| data | data |
Other Tags
<caption></caption>
Can be used as the title for the entire table.The caption tag is optional.
permitted parent table
Tables can be enhance with <thead>,<tbody> and <tfoot> which are used to group different sections of the table but they are not required. They can be used to organize your table and also inconjunction with CSS for layout.
<thead></thead>
Contains the contains the th tags
permitted parent table
when using <caption> and/or <colgroup> the <thead> is used after but before <hbody> and <hfoot>
<tbody></tbody>
Contains a block of rows
permitted parent table
<colgroup></colgroup>
A group of more than one column
Use the colgroup to apply styles to more than one column.
Attribute: span
<colgroup span="2" >
The above tag would allow you to add a style to the first two columns in a table.
permitted parent table.
If there is a <caption> tag within the table the <colgroup> needs to be placed after the <caption> tag otherwise directly after the <table> tag.
<tfoot></tfoot>
td is table data an individual cell
permitted parent table
