???????要求：用HTML實(shí)現(xiàn)如下所示的表格
???????對(duì)于初學(xué)者而言當(dāng)看到這個(gè)表格的時(shí)候會(huì)不會(huì)有點(diǎn)懵呢？表頭又是行合并，又是列合并的，我們不妨從最簡(jiǎn)單的入手，可以先將表格的主體創(chuàng)建好，主體的最后一行只有2列，第一列是將前3列進(jìn)行合并成為1列。
<html>
<body>
<table border="1" >
<caption>購(gòu)物車(chē)</captipon>
<tbody style="text-align:center">
<tr>
<th> 蘋(píng)果 </th>
<td> 3公斤 </td>
<td> 5元/公斤 </td>
<td> 15元 </td>
</tr>
<tr>
<th> 香蕉 </th>
<td> 2公斤 </td>
<td> 6元/公斤 </td>
<td> 12元 </td>
</tr>
<tr>
<th colspan=3>總價(jià)</th>
<td>27元</td>
</tr>
</tbody>
</table>
</body>
</html>
效果如下圖所示：
???????接下來(lái)，我們就可以對(duì)表頭進(jìn)行分析，表頭實(shí)際上是2行2列，
名稱列和 小計(jì)列是將兩行合并成一行，2016-11-22列是將 重量 和 '單價(jià)' 列進(jìn)行合并成為一列。對(duì)表頭進(jìn)行分析后，我們可以在表主體上添加設(shè)置表頭的代碼：
<thead>
<tr >
<th rowspan=2> 名稱 </th>
<th colspan=2> 2016-11-22 </th>
<th rowspan=2> 小計(jì) </th>
</tr>
<tr>
<th> 重量 </th>
<th> 單價(jià) </th>
</tr>
</thead>
全部代碼：
<html>
<body>
<table border="1" style="height: 112px; width: 339px">
<caption>購(gòu)物車(chē)</captipon>
<thead>
<tr >
<th rowspan=2> 名稱 </th>
<th colspan=2> 2016-11-22 </th>
<th rowspan=2> 小計(jì) </th>
</tr>
<tr>
<th> 重量 </th>
<th> 單價(jià) </th>
</tr>
</thead>
<tbody style="text-align:center">
<tr>
<td> 蘋(píng)果 </td>
<td> 3公斤 </td>
<td> 5元/公斤 </td>
<td> 15元 </td>
</tr>
<tr>
<td> 香蕉 </td>
<td> 2公斤 </td>
<td> 6元/公斤 </td>
<td class="style1"> 12元 </td>
</tr>
<tr>
<td colspan=3>總價(jià)
</td>
<td>27元
</td>
</tr>
</tbody>
</table>
</body>
</html>
效果如圖：
