html 表格

HeadingAnother Heading
row 1, cell 1 row 1, cell 2
row 2, cell 1 row 2, cell 2

背景颜色:

First Row
Second Row

背景图像:

First Row
Second Row

这个表格没有边框:

100 200 300
400 500 600

这个表格也没有边框:

100 200 300
400 500 600

横跨两列的单元格:

姓名电话
Bill Gates 555 77 854 555 77 855

横跨两行的单元格:

姓名 Bill Gates
电话 555 77 854
555 77 855
【表格举例】
 列-A列-B列-C
行-1 A1 B1 C1-C2
行-2 A2 B2
行-3 A3 A3-B3


表格源码

<table border="1">
<tbody>
<tr><th>Heading</th><th>Another Heading</th></tr>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</tbody>
</table>
<h4>背景颜色:</h4>
<table border="1" bgcolor="red">
<tbody>
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</tbody>
</table>
<h4>背景图像:</h4>
<table border="1">
<tbody>
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</tbody>
</table>
<h4>这个表格没有边框:</h4>
<table>
<tbody>
<tr>
<td>100</td>
<td>200</td>
<td>300</td>
</tr>
<tr>
<td>400</td>
<td>500</td>
<td>600</td>
</tr>
</tbody>
</table>
<h4>这个表格也没有边框:</h4>
<table border="0">
<tbody>
<tr>
<td>100</td>
<td>200</td>
<td>300</td>
</tr>
<tr>
<td>400</td>
<td>500</td>
<td>600</td>
</tr>
</tbody>
</table>
<h4>横跨两列的单元格:</h4>
<table border="1">
<tbody>
<tr><th>姓名</th><th colspan="2">电话</th></tr>
<tr>
<td>Bill Gates</td>
<td>555 77 854</td>
<td>555 77 855</td>
</tr>
</tbody>
</table>
<h4>横跨两行的单元格:</h4>
<table border="1">
<tbody>
<tr><th>姓名</th>
<td>Bill Gates</td>
</tr>
<tr><th rowspan="2">电话</th>
<td>555 77 854</td>
</tr>
<tr>
<td>555 77 855</td>
</tr>
</tbody>
</table>
<table style=" 250px;" border="4" align="center"><caption>【表格举例】</caption>
<tbody>
<tr bgcolor="#cccccc"><th>&nbsp;</th><th>列-A</th><th>列-B</th><th>列-C</th>
 </tr>
<tr align="center">
<td>行-1</td>
<td>A1</td>
<td>B1</td>
<td rowspan="2">C1-C2</td>

 </tr>
<tr align="center">
<td>行-2</td>
<td>A2</td>
<td>B2</td>

 </tr>
<tr align="center">
<td>行-3</td>
<td>A3</td>
<td colspan="2">A3-B3</td>

 </tr>

</tbody>
</table>
原文地址:https://www.cnblogs.com/endv/p/6217469.html