如何添加多个标题 HTML 表格?
Posted
技术标签:
【中文标题】如何添加多个标题 HTML 表格?【英文标题】:How to add multiple header HTML table? 【发布时间】:2017-10-09 09:59:17 【问题描述】:我想设计一个有多个标题的表格。桌子设计在那里:
【问题讨论】:
什么阻止了你? 欢迎来到Stack Overflow!您需要尝试自己编写代码。在完成research 之后,您仍然遇到问题,您可以发布您尝试过的内容,并明确说明什么不起作用,并提供一个Minimal, Complete, and Verifiable example。阅读How to Ask a good question。另外,请务必使用tour。 【参考方案1】:看看这个fiddle
关于 colspan 和 rowspan
<table>
<thead>
<tr>
<th rowspan="2" colspan="1" >
Client Name
</th>
<th rowspan="2" colspan="1">
Date
</th>
<th rowspan="1" colspan="5">
All Appointments
</th>
<th rowspan="1" colspan="3" >
Fulfilled Appointments
</th>
</tr>
<tr>
<th>Total number of individual appointments</th>
<th >Hours Of Care Delivered</th>
<th>Total Value</th>
<th>Average Cost Per Hour</th>
<th>Average Cost Per Hour Per Carer</th>
<th>Total Number</th>
<th>Hours Of Care Fulfilled</th>
<th>Total Value</th>
</tr>
</thead>
<tbody></tbody>
</table>
【讨论】:
【参考方案2】:<html>
<head>
<title>Table</title>
<style>
table,th,td
border: 2px solid red;
border-collapse: collapse;
.heightu
height: 212px;
div.First
border: 1px solid red;
width: 49px;
height:10px;
left: 15px;
div.Second
border: 1px solid red;
width: 49px;
height:10px;
left: 15px;
div.Third
border: 1px solid red;
width: 39px;
height:10px;
left: 15px;
</style>
</head>
<body>
<table>
<tr>
<th rowspan="2">Sl.No</th>
<th rowspan="2">Name</th>
<th colspan="2">Date:15/05/2021</th>
<th rowspan="2">Do </th>
</th>
</tr >
<tr>
<th rowspan=>Start Hour</th>
<th rowspan=>End Hour</th>
</tr>
<tr>
<td>1</td>
<td>John Ddoe</td>
<td ><div class="First"></div></td>
<td><div class="Second"> </div></td>
<td><div class="Third"></div></td>
</tr>
<tr class="heightu">
<td></td>
<td></td>
</td>
<td ></td>
<td ></td>
<td ></td>
</tr>
</table>
</body>
</html>
【讨论】:
以上是关于如何添加多个标题 HTML 表格?的主要内容,如果未能解决你的问题,请参考以下文章
调用 html 时,如何从包含多个表格的 HTML 文件中显示特定表格? [关闭]