好，今天也是没什么内容的一天（你
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表格</title>
<style type="text/css">
/* .tab1{width: 80%;margin: auto}
caption{font-size: 24px;margin: 12px;color: blue;}
th,td{border: solid 1px cornflowerblue;padding: 8px;}
tfoot td {text-align: right;color: coral;}
.col1{width: 25%; color: crimson; font-size: 16px;}*/
</style>
</head>
<body>
<div>
<table border="2" class="tab1" cellpadding="6" cellspacing="10">
<!-- cellpadding定义单元格与其边缘内容的空白；cellspacing属性定义单元格之间的空间。-->
<caption><h3>我是表格标题</h3></caption>
<th>表头1</th>
<th>表头2</th>
<th>表头3</th>
<tr>
<td>我是1.1</td>
<td>我是1.2</td>
</tr>
<tr>
<td>我是2.1</td>
<td>我是2.2</td>
</tr>
</table>
</div>
<div>
<table width="80%" border="1" rules="all">
<caption>结构化表格</caption>
<thead>
<tr><th>标签</th><th>说明</th></tr>
</thead>
<tfoot>
<tr><td colspan="2">*表格中上述标签可选</td></tr>
</tfoot>
<tbody>
<tr><td align="center"><thread></td><td>定义表头结构。</td></tr>
<!-- abbr定义单元格内容的缩写；axis为单元格取一个类名为数据分类便于浏览器检索(但是目前没有浏览器支持。。。)。-->
<tr><td valign="top"><tbody></td><td>定义表格主体结构。</td></tr>
<tr><td><tfoot></td><td>定义表格页脚结构。</td></tr>
</tbody>
</table>
</div>
<div>
<table border="1" frame="hsides" rules="rows">
<!-- frame设置表的外边框线显示，类似border的扩展rules设置数据表的内边线显示。-->
<caption>其他</caption>
<!-- <col align="left" />
<col align="center" />
<col align="right" />-->
<colgroup span="2" class="col1"></colgroup>
<tr><td>wwww</td><td>mmmm</td><td>wwww</td></tr>
<tr><td>wwww</td><td>mmmm</td><td>wwww</td></tr>
<tr><td>wwww</td><td>mmmm</td><td>wwww</td></tr>
<tr><td colspan="3">Chrome只支持列分组标签col的span，width属性(....。</td></tr>
</table>
</div>
</body>
</html>
来源：CSDN
作者：竭鱼
链接：https://blog.csdn.net/qq_34924101/article/details/103975465