HTML col Tag

HTML <col> tag is used to define the properties of each column of a table separately.

• The <col> tag is defined inside the <colgroup> tag which itself is defined in the <table> tag.

• Each <col> tag in a <colgroup> tag represents a column of the table. One single <col> tag can represent more than one consecutive column too, by using the span attribute.

• The <col> tag does not have an ending tag.

HTML <col> Tag - Syntax and Usage

The <col> element requires the start(opening) tag, the required syntax for same is given below:

<col style=" " />

HTML <col> Tag Basic Example

Below we have a basic example of the <col> tag:

In the code example above, we have specified 4 <col> tags to style the 4 columns of the table. Now, let's see how we can use a single <col> tag to style multiple columns of a table.

In the example below, we have 2 <col> tags covering 4 columns of the table, using the span attribute with value 2 each.

<table>
    <colgroup>
        <col span="2" style="background-color:green" />
        <col span="2" style="background-color:orange" />
    </colgroup>
    <tr>
        <th>Emp Id</th>
        <th>Emp name</th>
        <th>DOB</th>
        <th>Address</th>
    </tr>
    <tr>
        <td>001</td>
        <td>Palak</td>
        <td>08-09-1985</td>
        <td>11, Adarsh Nagar</td>       
    </tr>
</table>

In the example below, we have 2 <col> tags covering 4 columns of the table, using the span attribute with value 3 and one <col> tag without the span attribute.

<table>
    <colgroup>
        <col span="3" style="background-color:green" />
        <col style="background-color:orange" />
    </colgroup>
    <tr>
        <th>Emp Id</th>
        <th>Emp name</th>
        <th>DOB</th>
        <th>Address</th>
    </tr>
    <tr>
        <td>001</td>
        <td>Palak</td>
        <td>08-09-1985</td>
        <td>11, Adarsh Nagar</td>       
    </tr>
</table>

HTML <col> Tag Attributes

This element does not have any specific attributes although this element supports Global attributes and Event attributes.

The main attribute for the <col> tag is the span attribute which is used to define how many columns will the <col> tag cover.

Default CSS style for HTML <col> tag

col
{
   display:table-column;
}

Browser Support for HTML <col> tag

Following browsers support this attribute:

• Firefox 1+

• Google Chrome 1+

• Internet Explorer 4+

• Apple Safari 1+

• Opera 7+