頭部內的多個表頭

我的HTML表格有一個特殊的頭部，其中包含3個帶有自己表格行的子頭部。我試圖使用rowspan和colspan來完成它，但我迷失在兩者之間。我將盡我所能來說明我正在嘗試使用HTML表格來實現的目標。頭部內的多個表頭

/-------------------------------------------------------------\ 
|   |    Two    |   |   | 
| One  |------------------------------| Three | Four | 
|   | Two A | Two B | Two C |   |   | 
|-----------------------------------------|---------|---------| 
| 1.0  | 20.00 | 40.00 | 52.00 | 45 | 62 | 
|-----------------------------------------|---------|---------| 
| 2.0  | 60.00 | 70.00 | 84.00 | 54 | 45 | 
\-------------------------------------------------------------/

這可以使用只有HTML表或我需要托盤任何其他方法？

來源

2017-04-12 Kevin S

-1

這是你在找什麼。如果您需要在表格標題中嵌套表格。

<table> 
 
<tr> 
 
<th>1</th><th colspan="2">MAIN<table><tr><td>2</td><td>3</td></tr></table></th><th>4</th> 
 
</tr> 
 
<tr> 
 
<td>1</td><td>2</td><td>3</td><td>4</td> 
 
</tr> 
 
<tr> 
 
<td>1</td><td>2</td><td>3</td><td>4</td> 
 
</tr> 
 
<tr> 
 
<td>1</td><td>2</td><td>3</td><td>4</td> 
 
</tr> 
 
<tr> 
 
<td>1</td><td>2</td><td>3</td><td>4</td> 
 
</tr> 
 
</table>

來源

2017-04-12 20:32:03 Cam

這裏是剛剛rowspan的另一種解決方案，併合並單元格

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <style> 
 
     table, 
 
     th, 
 
     td { 
 
      border: 1px solid black; 
 
      border-collapse: collapse; 
 
     } 
 
     
 
     th, 
 
     td { 
 
      padding: 5px; 
 
      text-align: center; 
 
     } 
 
    </style> 
 
</head> 
 

 
<body> 
 

 
    <table style="width:100%"> 
 
     <tr> 
 
      <th rowspan="2">One</th> 
 
      <th colspan="3">Two</th> 
 
      <th rowspan="2">Three</th> 
 
      <th rowspan="2">Four</th> 
 
     </tr> 
 
     <tr> 
 
      <th>Two A</th> 
 
      <th>Two B</th> 
 
      <th>Two C</th> 
 
     </tr> 
 
     <tr> 
 
      <td>1.0</td><td>10.00</td><td>40.00</td><td>52.00</td><td>40</td><td>62</td> 
 
     </tr> 
 
     <tr> 
 
      <td>2.0</td><td>60.00</td><td>70.00</td><td>84.0</td><td>54</td><td>45</td> 
 
     </tr> 
 
    </table> 
 

 
</body> 
 

 
</html>

來源

2017-04-12 20:59:41

頭部內的多個表頭

回答

相關問題