HTML创建奇形状的表

Question

创建如下所示的表的好方法是什么：

                           | Horizontal header data1  |Horizontal header data2|
                           | Horizontal header data2  |Horizontal header data2|
|Vert header 1|Vert header2| data                     | data                  |
|Vert header 3|Vert header4| data                     | data                  |
|Vert header 5|Vert header6| data                     | data                  |

我有一些解决方案，有很多服务器端预处理。 2个数据结构（水平标题，表格的其余部分）然后在HTML中我只是将表格分成两部分。但还有其他方法吗？

Answer 1

td{
border: 1px solid #ccc
}
table{
border-collapse: collapse;
}

<table>
<tr>
  <!-- if you want to combaine 1st 2 columns  use <td colspan="2"></td> and delete 2nd <td></td> tag below --> 
  <td></td>
  <td></td>
  <td>Horizontal header data1</td>  
  <td>Horizontal header data2</td>  
</tr>
<tr>
  <td>Vert header 1</td>
  <td>Vert header 1</td> 
  <td>data</td>
  <td>data</td>
</tr>
  
<tr> 
  <td>Horizontal header data1</td>  
  <td>Horizontal header data2</td> 
  <td>data</td>
  <td>data</td> 
</tr>
  
<tr> 
  <td>Horizontal header data1</td>  
  <td>Horizontal header data2</td>
  <td>data</td>
  <td>data</td>  
</tr>
</table>