HTML colgroup 用法說明

< colgroup> 是 HTML 中的一個元素，用於定義表格列（columns）的屬性，通常用來設定一組列的共同樣式或行為，以簡化表格的樣式和結構設定。它通常與 元素一起使用，用來指定列的寬度、背景色、文字對齊等屬性。
以下是 < colgroup> 的一般用法說明：
定義 < colgroup> 元素：在表格 (< table>) 元素內部，你可以使用 < colgroup> 元素來定義列的屬性。通常，它會位於表格的開頭，但在表格內部的任何位置都可以。

<table>
  <colgroup>
    <col style="width: 100px;">
    <col style="background-color: lightblue;">
  </colgroup>
  <!-- 表格內容 -->
</table>

使用 < col> 元素：在 < colgroup> 元素內部，你可以使用一個或多個 < col> 元素來指定不同列的屬性。這些屬性可以包括列的寬度、背景色、文字對齊等。

<colgroup>
  <col style="width: 100px;">
  <col style="background-color: lightblue;">
</colgroup>

1. 繼承屬性：當你在 < colgroup> 中指定列的屬性時，這些屬性將應用於整個列，除非在特定的 < col> 元素中進一步覆蓋。
2. 節省重複代碼：使用 < colgroup> 可以幫助節省重複的 HTML 代碼，尤其是當你希望多列具有相同的樣式或屬性時，這在大型表格中特別有用。

這是一個簡單的示例，展示了 < colgroup> 和 < col> 的使用：

<table>
  <colgroup>
    <col style="width: 100px;">
    <col style="background-color: lightblue;">
  </colgroup>
  <tr>
    <th>Header 1</th>
    <th>Header 2</th>
  </tr>
  <tr>
    <td>Data 1</td>
    <td>Data 2</td>
  </tr>
</table>

在這個示例中，< colgroup> 定義了兩列的屬性，其中一列設置了寬度，另一列設置了背景顏色，這些設置應用於整個表格。這有助於提高代碼的可讀性和維護性。