HTML <col> Element
The <col> element defines the values of attributes of one or more columns in an HTML table.
In HTML tables are constructed row by row but the <col> element gives you a method of applying attributes to whole
columns instead of having to apply attributes to each individual <td> element.
The span attribute sets the number of columns affected by the styles and the style attribute is used to define the CSS styles which will be applied to the column or columns.
Be careful not to confuse <col> plus the span attribute with the colspan attribute which can be applied to
<th> and <td> elements. The colspan attribute defines how many columns an individual cell of a table will occupy in
one row, but <col> plus span applies to all the rows in the specified columns.
In the following example two <col> elements have been used with the
span and style attributes along with the CSS background-color
property to add a background colour to the table columns.
Example code:
<col span="2" style="background-color: red">
<col style="background-color: green" />
<tr><td>Column 1<td/>
<td>Column 2<td/>
<td>Column 3<td/></tr>
<tr><td>Column 1<td/>
<td>Column 2<td/>
<td>Column 3<td/></tr>
<tr><td>Column 1<td/>
<td>Column 2<td/>
<td>Column 3<td/></tr>
</table>
Resulting table:
| Column 1 | Column 2 | Column 3 |
| Column 1 | Column 2 | Column 3 |
| Column 1 | Column 2 | Column 3 |
<col> Attributes
- CORE AND LANGUAGE ATTRIBUTES - class, id, title, style, dir, lang
- MOUSE AND KEYBOARD EVENT ATTRIBUTES - onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmouseout, onmousemove, onkeydown, onkeyup, onkeypress
- span - has a number value which specifies the number of columns to which the
<col>element applies. - width - specifies a default width for each column spanned by the
<col>element. - align* - specifies the alignment of content in a cell, values can be left, center, right, justify, char.
- valign* - specifies the vertical alignment of data in a cell. Values can be top, middle, bottom, baseline.
- char* - sets a single character in a line of text to act as the axis from which alignment takes place.
- charoff* - sets the offset from the first instance of the alignment character in each line of text.
*NOTE: In HTML4 char and charoff are not supported by any of the major browsers and support for align and valign is variable.
In HTML5 the only attribute which will be supported on the <col> element is span, the other five will not be included in
the specification.