HTML col tag

HTML col tag defines one or more columns in a table. col element is the child of colgroup. It takes part in making the model of a table.

<table class="demoBox">
 <colgroup>
  <col style="background-color:lightgreen;">
  <col style="background-color:lightblue;">
  <col style="background-color:lightyellow;">
 </colgroup>
		
 <tr>
  <th> Countries </th>
  <th> Population </th>
  <th> Area </th>
 </tr>
		
 <tr>
  <td> Philippines </td>
  <td> 104,918,090 </td>
  <td> 300,000 </td>
 </tr>
		
 <tr>
  <td> Mexico </td>
  <td> 129,163,276 </td>
  <td> 1,964,375 </td>
 </tr>
		
</table>

</>
Countries Population Area
Philippines 104,918,090 300,000
Mexico 129,163,276 1,964,375

Tag Uses

Specific uses of <col> tag

The purpose of col element is to style indivisual columns instead of rows. More than one columns can be styled using span attribute.

Tag omission

col tag is self closing tag (<col />) i.e. there is no end tag.

Global Attributes

All the global attributes are applicable on the <col> tag.

Tag Attributes

Attributes that are applicable to <col> tag
span

It allows a <col> tag to span more than one columns. Its value is a positive integer.

<colgroup> <col span="3"></col> </colgroup>


Was this article helpful?