<col> Tag in HTML

The <col> tag is used to define column properties in an HTML table. It is a self-closing tag that provides styling information for columns in a <table> element. The <col> tag is useful when you want to apply styles to individual columns of a table.

Key Points on <col> Tag:

• The <col> tag is used to style or define properties of table columns.
• It must be placed inside the <colgroup> tag, which groups one or more columns.
• It does not contain any content and is purely for styling or defining properties like width or background color for columns.
• The <col> tag is helpful when you want to apply consistent styling to an entire column.

Syntax of <col> Tag:

<col> or <col style="property:value">

Example of <col> Tag in HTML:

This example demonstrates how to use the <col> tag to apply styling to table columns.

        <table>
          <colgroup>
            <col style="background-color: blue;">
            <col style="background-color: green;">
            <col style="background-color: yellow;">
          </colgroup>
          <tr>
            <td>Row 1, Column 1</td>
            <td>Row 1, Column 2</td>
            <td>Row 1, Column 3</td>
          </tr>
          <tr>
            <td>Row 2, Column 1</td>
            <td>Row 2, Column 2</td>
            <td>Row 2, Column 3</td>
          </tr>
        </table>
                

Attributes of <col> Tag:

• style: Defines the inline CSS styles for the column, such as width, background-color, etc.
• span: Specifies how many columns the <col> element should span. (e.g., span="2")

The <col> tag is an effective way to apply styles such as background color, width, or other CSS properties to entire columns in a table. It's commonly used when working with large tables and when you need consistent styling across multiple rows in the same column.