6-9 單元格的群組化<colgroup>和<col>元素

在表格使用中，如果想將整個列的單元格群組化，可以使用<colgroup>和<col>元素。在使用上<col>是<colgroup>的子元素，用于定義<colgroup>每一個列的列屬性。<col>這個元素沒有結束標記。<colgroup>元素在使用時必須放在<table>元素內，在<caption>之后但是需在<thead>、<tbody>、<tfoot>和<tr>元素之前。<colgroup>配合<col>元素的使用格式如下：

上述span屬性設定的n值，主要是定義列的列數。如果省略span屬性，則列數是1。

程序實例ch6_10.html：群組列的應用。這個程序將群組化的列數設為3，不更改表格的定義，設定第一個群組列的背景色是灰色、第二個群組列的背景色是黃色、第三個群組列的背景色是橘色。這個程序筆者使用了尚未講解的樣式表元素“style”，在本書第11章起會大量介紹此元素，暫時建議讀者只要了解即可：

    style="background-color:lightgray"
    style="background-color:yellow"
    style="background-color:orange"

可分別產生背景色為灰色、黃色和橘色。

執行結果

上述程序第11行定義了第一個群組列，由于省略span屬性設定，所以只有一列，顯示背景色是灰色。第12行定義了第二個群組列，也只有一列，顯示背景色是黃色。第13行定義了第三個群組列，也是一列，顯示背景色是橘色。

程序實例ch6_11.html：這個程序重新設計ch6_10.html，第一個群組列依舊是指第一列，不過將第二和第三個列群組化成第二個群組列，同時令第一個群組列的表格背景色是灰色，第二個群組列的背景色是黃色。

執行結果

上述程序第11行定義了第一個群組列，但只有一列，背景色是灰色。最重要的是第12行，span="2"目的是定義這個群組列包含2列，背景色是黃色。