Markdown 表格

1. 前言

表格通常作為一種布局形式，用于結(jié)構(gòu)化的數(shù)據(jù)展示。

Markdown 表格包含三個(gè)部分：表頭、分割線、數(shù)據(jù)。

• 表頭 用來對(duì)列名對(duì)象進(jìn)行描述，也就是通常所說的列名；
• 數(shù)據(jù) 用來展示每行的具體內(nèi)容，數(shù)據(jù)是表格的核心；
• 分割線 用來區(qū)分表頭和數(shù)據(jù)，也是 Markdown 中表格定義的最基本語法要求。

環(huán)境說明：
考慮到 Markdown 工具之間的不兼容，有的內(nèi)容直接從頁面復(fù)制粘貼到本地不會(huì)正常顯示，大家學(xué)習(xí)時(shí)自己動(dòng)手寫是肯定沒問題的。本節(jié)所有實(shí)例代碼及演示效果均使用 Typora 工具完成。

2. 語法詳解

2.1 定義表格

Markdown 表格由 「豎線 |」、「減號(hào) -」、「冒號(hào) :」三種符號(hào)組成。

• 豎線 用來定義列，每兩個(gè)豎線之間為一個(gè)單元格元素；
• 減號(hào) 用來定義分割線，也就是分割表頭和數(shù)據(jù)體；
• 冒號(hào) 配合減號(hào)使用，用于定義列數(shù)據(jù)的對(duì)齊屬性。

我們先假定一組表格數(shù)據(jù)：

學(xué)號(hào)	姓名
1		張三
2		李四
3		王五

這其中，第一行 “學(xué)號(hào)” 和 “姓名” 就是表格的表頭，“1”、“2”、“3”，“張三”、“李四”，這些都屬于數(shù)據(jù)體，我們可以用以下方式展示表格內(nèi)容。

實(shí)例 1：

#### 定義表格

|學(xué)號(hào)|姓名|
|----|----|
|1|張三|
|2|李四|
|3|王五|

其渲染結(jié)果如下：

其轉(zhuǎn)換后的 html 的內(nèi)容如下：

<table>
<thead>
<tr>
<th>學(xué)號(hào)</th>
<th>姓名</th>
</tr>
</thead>
<tbody><tr>
<td>1</td>
<td>張三</td>
</tr>
<tr>
<td>2</td>
<td>李四</td>
</tr>
<tr>
<td>3</td>
<td>王五</td>
</tr>
</tbody></table>

2.2 設(shè)定表格列內(nèi)容的對(duì)齊方式

在分割線上使用 「冒號(hào) :」可以定義列內(nèi)容的對(duì)齊方式。

實(shí)例 2：

#### 表格內(nèi)容的對(duì)齊

|左對(duì)齊|居中對(duì)齊|右對(duì)齊|
|:--|:--:|--:|
|1|張三|17歲|
|2|李四|18歲|
|3|王五|19歲|

其渲染結(jié)果如下：

其轉(zhuǎn)換后的 html 的內(nèi)容如下：

<table>
<thead>
<tr>
<th align="left">左對(duì)齊</th>
<th align="center">居中對(duì)齊</th>
<th align="right">右對(duì)齊</th>
</tr>
</thead>
<tbody><tr>
<td align="left">1</td>
<td align="center">張三</td>
<td align="right">17歲</td>
</tr>
<tr>
<td align="left">2</td>
<td align="center">李四</td>
<td align="right">18歲</td>
</tr>
<tr>
<td align="left">3</td>
<td align="center">王五</td>
<td align="right">19歲</td>
</tr>
</tbody></table>

3. 使用場景及實(shí)例

表格在文章中多用于展示數(shù)據(jù)或者計(jì)劃，例如數(shù)據(jù)庫設(shè)計(jì)文檔中，對(duì)于 Table 內(nèi)容的展示、或者課程表等等。

實(shí)例 3：一張小學(xué)生課程表

#### 小學(xué)生課程表

| |周一|周二|周三|周四|周五|
|--:|---|---|---|---|---|
|**1**|數(shù)學(xué)|英語|數(shù)學(xué)|語文|品德|
|**2**|美術(shù)|數(shù)學(xué)|品德|數(shù)學(xué)|語文|
|**3**|品德|品德|語文|體育|數(shù)學(xué)|
|**4**|語文|音樂|體育|品德|美術(shù)|
|||||||
|**5**|數(shù)學(xué)|英語|語文|數(shù)學(xué)|語文|
|**6**|品德|數(shù)學(xué)|美術(shù)|勞動(dòng)|活動(dòng)|

其渲染結(jié)果如下：

4. 小結(jié)

• 數(shù)據(jù)表格使用「豎線」、「減號(hào)」、「冒號(hào)」三種符號(hào)定義，包含表頭、分割線、數(shù)據(jù)三部分；
• 數(shù)據(jù)表格必須包含 “表頭” 和 “分割線”，否則無法渲染成功；
• 數(shù)據(jù)表格轉(zhuǎn)換失敗通常由于表頭和分隔線的數(shù)量不相等所致，所以在遇到問題時(shí)，請(qǐng)首先檢查單元格數(shù)量是否匹配；
• Markdown 中的表格的原生支持只有固定格式，無法支持復(fù)雜格式，如果需要定義復(fù)雜的表格效果，請(qǐng)使用 html 的 <Table> 標(biāo)簽實(shí)現(xiàn)。