html基礎學習（表格）（二）

表格基本結構

表格其實就是很多的小單元格，而這些小單元格很有次序的排列着，它們有很多行，很多列。這些很多行列組成的東西，就叫表格，表格是<table>標籤來定義的。而<table>標籤中的行就是<tr>標籤，而列就是<td>標籤，必須先定義行才能定義列。因爲html中，每一列是在一行當中的。

表格	描述
<table>	定義表格
<caption>	定義表格標題
<th>	定義表格的表頭
<tr>	定義表格的行
<td>	定義表格的單元
<thead>	定義表格的頁眉
<tbody>	定義表格的主體
<tfoot>	定義表格的頁腳
<col>	定義表格的列屬性

基本表格用法

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>企業員工通訊錄</title>
</head>

<body>
    <table border="1" cellspacing="0" cellpadding="20" width="1000">
        <caption>企業員工通訊錄</caption>
        <tr>
            <th>姓名</th>
            <th>電話</th>
            <th>電子郵箱</th>
            <th>職務</th>
        </tr>
        <tr align="center">
            <td>張三</td>
            <td>18278305487</td>
            <td>[email protected]</td>
            <td>研發工程師</td>
        </tr>
        <tr align="center">
            <td>王二</td>
            <td rowspan="2">12356843687</td>
            <td>[email protected]</td>
            <td>研發經理</td>
        </tr>
        <tr align="center">
            <td>李四</td>
            <td>[email protected]</td>
            <td>研發工程師</td>
        </tr>
        <tr align="center">
            <td colspan="2">李四</td>
            <td>[email protected]</td>
            <td>研發工程師</td>
        </tr>
    </table>
</body>

</html>

效果如下圖