無序列表
- 列表中各個元素在邏輯上沒有先後順序，沒有級別之分
- 無序列表中，列表項之間屬於並列關係
- 每個列表項獨佔一行
- 無序列表是使用最廣泛的列表
- 無序列表語法：
<ul>無序列表開始
<li></li>每一個列表項
</ul>無序列表結束
有序列表
- 列表中各個元素在邏輯上有先後順序
- 有序列表中，列表項之間屬於並列關係
- 每個列表項獨佔一行
- 有序列表語法：
<ol>有序列表開始
<li></li>每一個列表項
</ol>有序列表結束
自定義列表
- 自定義列表是兩個層次的列表，由三種標籤構成
- 基本語法：
<dl></dl>表示自定義列表的開始和結束
<dt></dt>表示列表標題的開始和結束
<dd></dd>表示每個列表現
///////////////////////////////////
<dl>
<dt>東北三省</dt>
<dd>遼寧</dd>
<dd>吉林</dd>
<dd>黑龍江</dd>
<dt>西南三省</dt>
<dd>雲南</dd>
<dd>貴州</dd>
<dd>四川</dd>
</dl>
- 東北三省
- 遼寧
- 吉林
- 黑龍江
- 西南三省
- 雲南
- 貴州
- 四川
表格
創建表格
- table標籤用來定義表格
- tr標籤表示表格中的一行
- th標籤表示表頭單元格，文本加粗、居中
- td標籤表示表格中的一個單元格，文本左對齊
- 表格的單元格中可以放入任何元素
<table border="1">
<tr>
<th>表頭</th>
<td>表格一</td>
<td>表格二</td>
</tr>
</table>
表格合併
- colspan：橫向合併單元格，屬性值爲正整數，表示該單元格橫向合併的列數，保留要合併的第一個單元格，刪除其他單元格
- 語法：
<table border = "1">
<tr><th colspan="3">合併表格</th></tr>
<tr><td>表格1</td><td>表格2</td><td>表格3</td></tr>
</table>
- rowspan：縱向合併單元格，屬性值爲正整數，表示該單元格縱向合併的列數
- 語法：
<table border = "1">
<tr><th colspan="3">合併表格</th></tr>
<tr><td rowspan="3">表格1</td><td>表格2</td><td>表格3</td></tr>
<tr><td>表格1</td><td>表格2</td></tr>
<tr><td>表格1</td><td>表格2</td></tr>
</table>
| 合併表格 |
|---|
| 表格1 | 表格2 | 表格3 |
| 表格1 | 表格2 |
| 表格1 | 表格2 |
其他
- caption標籤：給表格添加標題，用來制定表格的標題或者說明；是table的子元素，必須放在table中使用
表格標題
| 合併表格 |
|---|
| 表格1 | 表格2 | 表格3 | 表格4 |
| 表格1 | 表格2 | 表格3 | 表格4 |
| 表格1 | 表格2 | 表格3 | 表格4 |
表格規範的寫法應該包含以下三部分內容，主要結合CSS、JavaScript來使用
- thead標籤：表示表格的表頭
- tfoot標籤：表示表格的頁腳
- tbody標籤：表示表格的主體
<table border = "1">
<thead style="background: blue">
<tr><th colspan="3">合併表格</th></tr>
</thead>
<tbody style="background: red">
<tr><td>表格1</td><td>表格2</td><td>表格3</td></tr>
<tr><td>表格1</td><td>表格2</td><td>表格3</td></tr>
<tr><td>表格1</td><td>表格2</td><td>表格3</td></tr>
</tbody>
<tfoot>
<tr><td colspan="3">備註：</td></tr>
</tfoot>
</table>
| 合併表格 |
|---|
| 表格1 | 表格2 | 表格3 |
| 表格1 | 表格2 | 表格3 |
| 表格1 | 表格2 | 表格3 |
| 備註： |
- colgroup標籤：用來組合列，它的span屬性可以設置組合列的數目；它可以包含一個子元素col；colgroup元素爲table元素的子元素，必須放在caption元素之前
<table border = "1">
<colgroup span = "1" style="width: 100px"></colgroup>
<colgroup span = "2" style="width: 200px"></colgroup>
<colgroup span = "1" style="width: 150px"></colgroup>
<tr><th colspan="4">合併表格</th></tr>
<tr><td>表格1</td><td>表格2</td><td>表格3</td><td>表格4</td></tr>
<tr><td>表格1</td><td>表格2</td><td>表格3</td><td>表格4</td></tr>
<tr><td>表格1</td><td>表格2</td><td>表格3</td><td>表格4</td></tr>
</table>
- col標籤：用來設定列的屬性，它也可以使用span屬性；一般作爲colgroup元素的子元素配合使用
<table border = "1">
<colgroup span = "1" style="width: 100px">
<col style="background: red">
</colgroup>
<colgroup span = "2" style="width: 200px">
<col style="background: aqua">
<col style="background: chocolate">
</colgroup>
<colgroup span = "1" style="width: 250px;">
<col style="background: green;">
</colgroup>
<tr><td>表格1</td><td>表格2</td><td>表格3</td><td>表格4</td></tr>
<tr><td>表格1</td><td>表格2</td><td>表格3</td><td>表格4</td></tr>
<tr><td>表格1</td><td>表格2</td><td>表格3</td><td>表格4</td></tr>
</table>
