<caption> 标签定义表格的标题。
<caption> 标签必须直接放置到 <table> 标签之后。
您只能对每个表格定义一个标题。
提示：通常这个标题会被居中于表格之上。然而，CSS 属性 "text-align" 和 "caption-side" 能用来设置标题的对齐方式和显示位置。
caption-side:bottom;属性规定表格标题的位置。可以有top、bottom、inherit。不支持left/right。
如果标题要放在左侧的话，不考虑IE的话，可以给table设置display: flex。这样标题就可以和表格并排显示，达到标题在左侧的目的。
还有一个办法，就是用合并单元格来模拟标题：
<tr> <td class="expert_caption" rowspan="4">表格标题</td> <td style="background-color: #ecf5fc">高级职称:8名</td> <td>副高级职称：4名</td> </tr>
rowspan：向下合并单元格。 colspan：横向合并单元格。
完整代码示例：
<style> .expert_title{ width: 26em; margin: 0 auto; } .expert_title table{ border-collapse: collapse; box-sizing: border-box; } .expert_title .expert_caption{ width: 1em; line-height: 1em; text-align: center; font-weight: bold; font-size: 1.25em; padding: 0 0.8em; border: none; } .expert_title td{ border: 1px solid #cecece; width: 11.45em; height: 1.8em; line-height: 1.8em; color: #666666; padding-left: 2em; box-sizing: border-box; } </style> </head> <body> <div class="expert_title"> <table> <tr> <td class="expert_caption" rowspan="4">我是标题</td> <td style="background-color: #ecf5fc">高级职称:8名</td> <td>副高级职称：4名</td> </tr> <tr> <td>教授：4名</td> <td style="background-color: #ecf5fc">副教授：2名</td> </tr> <tr> <td style="background-color: #ecf5fc">博士：2名</td> <td>博导：1名</td> </tr> <tr> <td>硕导：1名</td> <td style="background-color: #ecf5fc"><a href="/zjtd/">了解更多>></a></td> </tr> </table> </div> </body>
效果如下：
border-collapse 属性设置表格的边框是否被折叠成一个单一的边框或隔开，应用在table标签上。
<style> caption {caption-side:bottom;}
table { border-collapse: collapse;}
</style> </head> <body> <table border="1"> <caption>Table 1.1 Customers</caption> <tr> <th>Company</th> <th>Contact</th> <th>Country</th> </tr> <tr> <td>Alfreds Futterkiste</td> <td>Maria Anders</td> <td>Germany</td> </tr> <tr> <td>Berglunds snabbköp</td> <td>Christina Berglund</td> <td>Sweden</td> </tr> </table> <p><b>注意:</b>如果 !DOCTYPE 指定 IE 8 支持 caption-side 属性 .</p> </body>