HTML and CSS Reference
In-Depth Information
The
td
element must be a child of a
tr
element and must have a start tag. The end tag, though, is
optional, and the rules here are similar to those for the
tr
element. You may omit the end tag if the
td
element is immediately followed by either another
td
element or by a
th
element (more on this one later!)
or
if its parent contains no further content (meaning it's the last cell in its row).
Required Attributes
The
td
element has no required attributes.
Optional Attributes
In addition to the global attributes, the following are optional attributes of the
td
element.
colspan
: a positive integer indicating the number of adjacent columns to be
spanned by the table cell.
rowspan
: a positive integer indicating the number of adjacent rows to be spanned
by the table cell.
headers
: a space-separated list of unique IDs referencing
th
elements that act as
headers for the table cell.
The colspan attribute
The
colspan
attribute accepts a positive integer and instructs the browser to create a cell that spans as
many columns of the table as the attribute's value indicates. Listing 7-6 demonstrates this.
Listing 7-6.
A table demonstrating usage of the
colspan
attribute
<table>
<tr>
<td
colspan="2"
>Utility Belts</td>
</tr>
<tr>
<td>New</td>
<td>Used</td>
</tr>
<tr>
<td>9</td>
<td>27</td>
</tr>
</table>
Figure 7-1 shows the rendered output of this code. For illustrative purposes, we've added a background
color to the spanned cell.