Html: Table

简单标准表格：Html命令：
<table border="1" style="height: 80px;"><tbody>
<tr valign="top"><td>第1行第1列</td><td>第1行第2列</td></tr>
<tr valign="top"><td>第2行第1列</td><td>第2行第2列</td></tr>
<tr valign="top"><td>31</td><td>32</td></tr>
<tr valign="top"><td>41</td><td>42</td></tr>
</tbody></table>

第1行第1列	第1行第2列
第2行第1列	第2行第2列
31	32
41	42

<div>
<table border="1" bordercolor="#288822" cellpadding="3" cellspacing="2" style="width: 100%;"><tbody>
<tr valign="top"><td><div>
11 Merge</div>
</td><td colspan="2"><div>
11 Merge</div>
</td></tr>
<tr valign="top"><td style="width: 50%;"><div>
21</div>
</td><td><div>
12</div>
</td></tr>
<tr valign="top"><td><div>
31</div>
</td><td><div>
32</div>
</td></tr>
</tbody></table>
</div>

11 Merge	11 Merge
21	12
31	32

上下合并的表格、并可加表格线颜色：Html命令：
<div>
<table border="1" bordercolor="#000000" cellpadding="3" cellspacing="0" style="border-collapse: collapse; width: 100%;" summary=""><tbody>
<tr valign="top">
<td><div>11</div></td>
<td><div>12</div></td></tr>
<tr valign="top">
<td><div>21</div></td>
<td rowspan="2"><div>22 Merge</div></td></tr>
<tr valign="top">
<td><div>31</div></td>
</tr></tbody></table></div>

11	12
21	22 Merge
31

左右合并的表格、并可加表格线颜色：Html命令：
<br />
<div>
<table border="2" bordercolor="#288822" cellpadding="3" cellspacing="2" style="width: 100%;"><tbody>
<tr valign="top"><td colspan="2"><div>
11 Merge</div>
</td></tr>
<tr valign="top"><td Style="width: 50%;"><div>
21</div>
</td><td><div>
12</div>
</td></tr>
<tr valign="top"><td><div>
31</div>
</td><td><div>
32</div>
</td></tr>
</tbody></table>
</div>

<br />

相片、电脑作品、iPad作品、电脑教程、iPad教程、其他内容
21	12
31	32

简单表格1：Html Code:
<br />
<div>
<table border="1" bordercolor="#288822" cellpadding="0" cellspacing="0" style="width: 100%;"><tbody>
<tr valign="top"><td><div>
11</div>
</td><td><div>
12</div>
</td></tr>
</tbody></table>
</div>
<br />

11

12

简单表格+分隔符：Html Code:
<br />
<div>
<table border="1" bordercolor="#288822" cellpadding="0" cellspacing="0" style="width: 100%;"><tbody>
<tr valign="top"><td style="width: 50%;"><div>
11<br />
11<br />
<hr align="center" color="#288822" noshade="noshade" size="2" />
</div>
21</td><td><div>
12<br />
<hr align="center" color="#288822" noshade="noshade" size="2" />
</div>
22</td></tr>
</tbody></table>
</div>
<br />

11 11 21

12 22

简单表格2：Html Code:
<div>
<table border="1" bordercolor="#288822" cellpadding="3" cellspacing="0" style="width: 100%;"><tbody>
<tr valign="top"><td><div>
11</div>
</td></tr>
<tr valign="top"><td><div>
21</div>
</td></tr>
</tbody></table>
</div>

11

21

左右自由调整1-无外框，Html Code:

<div>
<table border="0" bordercolor="#ff99cc" bordercolordark="#a050ff" bordercolorlight="#c990ff" cellpadding="10" cellspacing="0" style="width: 100%;"><tbody>
<tr valign="top"><td><div>
<table border="10" bordercolor="#ff99cc" bordercolordark="#a050ff" bordercolorlight="#c990ff" cellpadding="5" cellspacing="0" style="width: 100%;"><tbody>
<tr valign="top"><td><div>
左右边框自由调整<br />
<br />&nbsp;</div>
</td></tr>
<tr valign="top"><td><div>
212222222</div>
</td></tr>
</tbody></table>
</div>
</td><td><div>
<table border="10" bordercolor="#ff99cc" bordercolordark="#a050ff" bordercolorlight="#c990ff" cellpadding="5" cellspacing="0" style="width: 100%;"><tbody>
<tr valign="top"><td><div>
12<br />
<br /></div>
</td></tr>
<tr valign="top"><td><div>
22</div>
</td></tr>
</tbody></table>
</div>
</td></tr>
</tbody></table>
</div>

左右边框自由调整 212222222

12 22

左右自由调整2-有外框：Html Code:

<div>
<table border="10" bordercolor="#ff99cc" bordercolordark="#a050ff" bordercolorlight="#c990ff" cellpadding="0" cellspacing="0" style="width: 100%;"><tbody>
<tr valign="top"><td><div>
<table border="1" bordercolor="#a050ff" cellpadding="5" cellspacing="0" style="width: 100%;"><tbody>
<tr valign="top"><td><div>
左右边框自由调整<br />
<br /></div>
</td></tr>
<tr valign="top"><td><div>
212222222</div>
</td></tr>
</tbody></table>
</div>
</td><td><div>
<table border="1" bordercolor="#a050ff" cellpadding="5" cellspacing="0" style="width: 100%;"><tbody>
<tr valign="top"><td><div>
12<br />
<br /></div>
</td></tr>
<tr valign="top"><td><div>
22</div>
</td></tr>
</tbody></table>
</div>
</td></tr>
</tbody></table>
</div>

左右边框自由调整 212222222

12 22

Html表格视频教学：

来源