<col>

The HTML <col> element defines the properties of table columns, such as width, within a <colgroup>, enabling uniform styling and formatting of those columns.

<col> Tag

The <col> element in HTML specifies column properties within a <colgroup> element. It helps apply styling and formatting consistently to specific columns in a table. The <col> element can only be used inside a <colgroup> that does not have a span attribute.

Syntax

index.html
<col style="property:value">

<col> Demo

The <colgroup> element groups table columns, and <col> elements inside it allow for styling individual columns. The span attribute on <col> determines how many columns it affects, with a default value of 1, enabling uniform styling across multiple columns.

Column 1 Column 2 Column 3
Data 1 Data 2 Data 3
index.html
<table>
  <colgroup>
    <col style="background-color: #f0f0f0; color:blue;">
    <col style="width: 150px;">
    <col>
  </colgroup>
  <thead>
    <tr>
      <th>Column 1</th>
      <th>Column 2</th>
      <th>Column 3</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Data 1</td>
      <td>Data 2</td>
      <td>Data 3</td>
    </tr>
  </tbody>
</table>

Example

  • The <colgroup> element is used to group columns for styling or layout purposes.
  • The first column has a background color applied.
  • The second column has a specific width set.
  • The third column follows the default styling.

span Attribute

The span attribute determines how many consecutive columns a <col> element affects. The default value is 1, and it must always be a positive integer greater than zero.

Deprecated Attributes

The following attributes were previously used in <col> but are now obsolete and should be replaced with CSS:

  • align
  • bgcolor
  • char
  • charoff
  • valign
  • width

align

Previously, the align attribute controlled horizontal text alignment (left, center, right, justify, or char). It is now deprecated, and the text-align CSS property should be used instead on <td> and <th> elements.

bgcolor

This attribute allowed setting a background color for each column using a color keyword or a hexadecimal value. It is now obsolete, and the background-color CSS property should be used instead.

char

The char attribute was meant to align text based on a specific character (e.g., a decimal point for numbers). However, it is no longer supported and does not affect modern HTML rendering.

charoff

This attribute was used to define the offset for the char attribute, determining how far the alignment character should be positioned. It is no longer supported in HTML5.

valign

Previously, the valign attribute controlled vertical text alignment in a column (top, middle, bottom, or baseline). This is now handled using the vertical-align CSS property on <td> and <th>.

width

The width attribute was used to set a column's width using pixels, percentages, or relative values. It is now deprecated in favor of the CSS width property.

Usage Notes

  • The <col> element must be placed inside a <colgroup> that does not have a span attribute.
  • <col> does not structurally group columns; its purpose is purely for applying styles.
  • Only a limited number of CSS properties apply directly to <col>.

Conclusion

The <col> tag in HTML is used within a <colgroup> element to apply consistent styles or properties to specific columns in a table. The span attribute determines how many columns the <col> element affects.