列表中間有第二個標題的HTML表格？

是否有可能在html中生成如下的單個表？我意識到可以把它做成兩張獨立的桌子，但我不想這樣做，因爲我想讓桌子完美地排列（一個直接在另一個底下）。列表中間有第二個標題的HTML表格？

下面可能嗎？

SINGLE TABLE: 
      Title 1 
———————————————————————————————— 
|  |      | 
|  |      | 
|  |      | 
|  |      | 
|  |      | 
———————————————————————————————— 
      Title 2 
———————————————————————————————— 
|  |      | 
|  |      | 
|  |      | 
|  |      | 
|  |      | 
————————————————————————————————

來源

2016-09-14 Maxim Lott

這不是一個服務的站點代碼 – dippas

@dippas大聲笑你回答第一個，然後刪除和評論XD – DaniP

我看到了我的錯誤，所以我糾正它;） – dippas

這將這樣的伎倆..

In your CSS add .. 
th { 
    text-align: center; 
    background: pink; 
}

在HTML

加。

<table> 
     <tr> 
    <!----><th colspan="2">title 1</th> 
     </tr> 
     <tr> 
      <td>row 1.1</td> 
      <td>row 1.2</td> 
     </tr> 
     <tr> 
      <td>row 2.1</td> 
      <td>row 2.2</td> 
     </tr> 
     <tr> 
    <!----><th colspan="2">title 2</th> 
     </tr> 
     <tr> 
      <td>row 3.1</td> 
      <td>row 3.2</td> 
     </tr> 
     <tr> 
      <td>row 4.1</td> 
      <td >row 4.2</td> 
     </tr> 
    </table>

只需添加你想要的標題行<th></th> ..

編輯
添加標籤表頭。加上建議使用@Paulie_D進行居中的CSS。

來源

2016-09-14 15:38:28

'th'必須有一個'tr'父母，提到寬度問題。不錯的選擇。 - https://jsfiddle.net/2tny25pg/ –

Tx清理它:)將編輯我的答案。 –

你可以在這裏生成的HTML表格：http://www.tablesgenerator.com/html_tables 我能夠做這樣的事：

<style type="text/css"> 
.tg {border-collapse:collapse;border-spacing:0;} 
.tg td{font-family:Arial, sans-serif;font-size:14px;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;} 
.tg th{font-family:Arial, sans-serif;font-size:14px;font-weight:normal;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;} 
.tg .tg-yw4l{vertical-align:top} 
</style> 
<table class="tg"> 
    <tr> 
    <th class="tg-yw4l"></th> 
    <th class="tg-yw4l"></th> 
    <th class="tg-yw4l"></th> 
    </tr> 
    <tr> 
    <td class="tg-yw4l" colspan="3"></td> 
    </tr> 
    <tr> 
    <td class="tg-yw4l"></td> 
    <td class="tg-yw4l"></td> 
    <td class="tg-yw4l"></td> 
    </tr> 
</table>

來源

2016-09-14 15:38:21

列表中間有第二個標題的HTML表格？

回答

相關問題