HTML：創建表格行

Question

我試圖在每行中創建具有不同列數的表格，但我很難做到這一點。

我至今想這一點，但這會導致不均勻的行標題和格式的表格中所有的怪異。

http://jsfiddle.net/q3M4R/8/

<th colspan="2">TITLE </th> 
    <tr> 
    <td>INFO 1</td> 
    <td>INFO 2</td> 
    </tr> 
    <tr> 
    <td>INFO 3</td> 
    <td>INFO 4 </td> 
    </tr> 
    <tr> 
    <td>INFO 5</td> 
    <td>INFO 6 </td> 
    </tr> 
    <tr> 
    <td>INFO 7</td> 
    <td>INFO 8 </td> 
    </tr> 
    <tr> 
    <td>INFO 9</td> 
    <td>INFO 10 </td> 
    </tr> 

Answer 1

東西沿着這些路線？發生什麼事情是你的表格單元正在縮小以適應其內容的大小。通過添加寬度並居中文本，您可以獲得更好的外觀。

td{width:250px; border: 1px solid black;} 
 
table, th{text-align: center; border: 1px solid black;}

<table> 
 

 
    <th colspan="2">TITLE </th> 
 
    <tr> 
 
    <td>INFO 1</td> 
 
    <td>INFO 2</td> 
 
    </tr> 
 
    <tr> 
 
    <td>INFO 3</td> 
 
    <td>INFO 4 </td> 
 
    </tr> 
 
    <tr> 
 
    <td>INFO 5</td> 
 
    <td>INFO 6 </td> 
 
    </tr> 
 
    <tr> 
 
    <td>INFO 7</td> 
 
    <td>INFO 8 </td> 
 
    </tr> 
 
    <tr> 
 
    <td>INFO 9</td> 
 
    <td>INFO 10 </td> 
 
    </tr> 
 

 
    <th colspan="2">TITLE</th> 
 
    <tr> 
 
    <td>INFO 1</td> 
 
    <td>INFO 2</td> 
 
    </tr> 
 
    <tr> 
 
    <td>INFO 3</td> 
 
    <td>INFO 4 </td> 
 
    </tr> 
 
    <tr> 
 
    <td>INFO 5</td> 
 
    <td>INFO 6 </td> 
 
    </tr> 
 
    <tr> 
 
    <td>INFO 7</td> 
 
    <td>INFO 8 </td> 
 
    </tr> 
 
    <tr> 
 
    <td>INFO 9</td> 
 
    <td>INFO 10 </td> 
 
    </tr> 
 
    <table> 
 

 
    </table>

http://jsfiddle.net/vnx8prek/