实例代码：
<!doctype html >
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
table,th,td{border:1px solid black;}
th,td{width:120px;padding:5px;text-align:center;}
caption.top{caption-side:top;}/* 表格上标*/
caption.bottom{caption-side:bottom;} /* 表格下标*/
caption{color:red;text-align:left;}
</style>
</head>
<body>
<h3>表格的标题实例</h3>
<table>
<caption class="top">注意：这是表格上标</caption>
<caption class="bottom">注意：这是表格下标</caption>
<tr>
<th>属性</th>
<th>值</th>
<th>注释</th>
</tr>
<tr>
<td>caption-side</td>
<td>top</td>
<td>表格上标题</td>
</tr>
<tr>
<td>caption-side</td>
<td>bottom</td>
<td>表格下标题</td>
</tr>
</table>
</body>
</html>
运行效果：
评论