The <col> tag defines the properties of one or more columns in the HTML table defined by the <table> tag. The <col> tag is often used with the <colgroup> tag which specifies a group with common properties.
The <col> tag is placed inside the <table> tag, before the <thead>, <tbody>, <tfoot> and <tr> tags, and after the <caption> tag if it is used (in the <caption> tag we insert the name of the table).
Syntax
The <col> tag is empty, which means that the closing tag isn’t required. But in XHTML, the (<col>) tag must be closed (<col/>).
Example of the HTML <col> tag:
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<style>
table, th, td {
border: 1px solid #666;
}
</style>
</head>
<body>
<table>
<colgroup>
<col span="2" style="width:20%; background-color:#eee;">
<col style="width:10%; background-color:#8ebf42;">
</colgroup>
<tr>
<th>Name</th>
<th>Gender</th>
<th>Age</th>
</tr>
<tr>
<td>Mary Nicolson</td>
<td>female</td>
<td>19</td>
</tr>
<tr>
<td>John Johnson</td>
<td>male</td>
<td>23</td>
</tr>
</table>
</body>
</html>
Result
Attributes
Attribute | Value | Description |
---|---|---|
align | Sets the alignment of the content of the column.
Not supported in HTML5. |
|
left | Aligns to the left. | |
right | Aligns to the right. | |
center | Aligns to the center. | |
justify | Stretches the lines so that each line has equal width. | |
char | Aligns a special character with a minimum offset, which is defined by the char and charoff attributes. | |
char | character | Aligns the content related to a <col> element to a character. It is used only if the attribute is align = "char".
Not supported in HTML5. |
charoff | number | Shifts the content of the cell relative to the character specified as the value of the attribute to the right (positive values) or to the left (negative values).
It is used only if the attribute is align = "char".
Not supported in HTML5. |
span | number | Sets the quantity of columns, the properties of which are determined by the <col> element. The number must be a positive integer. If the parameter is not specified, the default value is 1. |
valign | Aligns the content vertically. | |
top | Aligns at the top of the line. | |
bottom | Aligns the bottom edge. | |
middle | Aligns in the middle. | |
baseline | Aligns the baseline. Not supported in HTML5. |
|
width | % pixels relative_length |
Sets the width of the column.
Not supported in HTML5. |
The <col> tag also supports the Global Attributes and the Event Attributes.
Browser support
✓ | ✓ | ✓ | ✓ | ✓ |
Practice Your Knowledge
Quiz Time: Test Your Skills!
Ready to challenge what you've learned? Dive into our interactive quizzes for a deeper understanding and a fun way to reinforce your knowledge.