[05]HTML基礎之表格標簽

1. <table>標簽

表格容器，儘量避免用屬性書寫樣式，而是用CSS來表達

border: 數字  //表格邊框寬度

2. <caption>標簽

表格的標題，一般出現在表格上方，可通過CSS更改方向

3. <tr>標簽

表示表格的一行。

4. <th>標簽

表頭的一個單元，與<tr>相比，一般做一列的標題，不展示內容

5. <tr>標簽

表格的一個單元，表格的最小單位

6. <col>標簽

表示當前所占的列數,用於應用CSS樣式，span屬性指定應用樣式的列數。span：橫跨的列數

7. <colgroup>標簽

對<col>標簽進行分組。

8. <thead>標簽

表示表格的頭部

9. <tbody>標簽

表示表格的主體

10. <tfoot>標簽

表示表格的腳部

由於表格標簽並不單獨使用，這裡放在一起做個集合。這些標簽有許多屬性，但大部分都是關於佈局之類的，而這些屬性實現的效果，用CSS也可以實現。所以，在html5之後，已經不推薦使用這些屬性。

<!-- 表格容器 border：表格邊框 -->
<table border>
    <!-- 表格標題 -->
    <caption>用戶</caption>
    <!-- 列容器 -->
    <colgroup>
        <!-- 應用CSS樣式的列 span:列數 -->
        <col style="background:#f60"></col>
        <col style="color:#f60"></col>
    </colgroup>
    <!-- 表格頭部 -->
    <thead>
        <!-- 表格一行 -->
        <tr>
            <!-- 頭部單個單元格 -->
            <th>姓名</th>
            <th>年齡</th>
        </tr>
    </thead>
    <!-- 表格主體 -->
    <tbody>
        <tr>
            <!-- 主體單個單元格 colspan:橫跨列數 rowspan:橫跨行數 -->
            <td>張三</td>
            <td>18</td>
        </tr>
    </tbody>
    <!-- 表格底部 一般用於統計之類 -->
    <tfoot>
        <tr>
            <th>1個</th>
            <th>2項</th>
        </tr>
    </tfoot>
</table>