- table is the parent element
- tr (short for table row) is inside (a child) of the table element
- th (short for table header) is placed inside (a child) of the tr element and is used to give a title/heading to a column
- td (short for table data; also called a cell) is placed inside (a child) of the tr element and contains the actual content for the table
A Basic Table
|This is a single cell in a basic table|
<td>This is a single cell in a basic table
The table and cell sizes are based upon the amount of content.To set a specific size, you can add the style attribute and add width and/or height just like with an image.
A temporary border attribute has been placed in the opening table tag. This makes the table structure more obvious. This is deprecated code that should only be used for testing. To add a permanent border, use CSS instead.
Columns and Rows
Tables can have multiple columns and/or multiple rows.
Short for column span
allows a single cell to take the space of multiple columns.
A combination of row + span
allows a single cell to span across multiple rows.
More complex arrangements can be created by placing an entire table
inside the cell (td)
of another table.