HTML Table Colgroup

HTML <colgroup> is a tag that is used to group one or more <col> elements together in a table. The <col> elements within a <colgroup> share the same properties, such as width, alignment, background color, and borders. This helps to reduce redundancy in the HTML code and makes it easier to style tables.

The <colgroup> tag is typically placed before the first <thead>, <tbody>, or <tfoot> element in a table. Here is an example of how to use <colgroup>:

<table>
  <colgroup>
    <col style="background-color: yellow;">
    <col style="background-color: cyan;">
  </colgroup>
  <tr>
    <td>Cell 1</td>
    <td>Cell 2</td>
  </tr>
  <tr>
    <td>Cell 3</td>
    <td>Cell 4</td>
  </tr>
</table>

In this example, the <colgroup> tag groups two <col> elements together. The first <col> element has a yellow background color, and the second <col> element has a cyan background color. These colors will be applied to all cells in the table that are in the same column as the respective <col> element.

Note that the <col> tag can also be used without a <colgroup> tag. In this case, the properties defined for the <col> tag will be applied to all cells in the same column as the <col> element. However, using <colgroup> can make the HTML code more organized and easier to read.