創建許多TD

Question

表我想使這個表格佈局：

我：

<table border="1"> 
<tr> <td colspan="3">aaa</td> <td colspan="3">aa</td> </tr> 
<tr> <td>a</td> <td> aa </td> <td> aaa </td> <td>aa</td><td>aa</td><td>aa</td> </tr> 
</table> 

，但我怎麼能做出其他人呢？

LIVE：http://jsfiddle.net/jsTvA/1/

Answer 1

這就是：

代碼：http://jsfiddle.net/jsTvA/14/

Answer 2

你可以在單元格中創建一個新表。

Answer 3

如果你想有一個單一的表來解決這個問題的方式：

1. 制定行，你需要列的最大數量。在你的情況下，它看起來像8列，6行。
2. 製作一個這種尺寸的簡單表格。
3. 開始設置colspan和rowspan對td s和刪除td s旁邊。
4. 重複此操作，直到獲得您喜歡的格式。

Answer 4

爲了使這個結構就需要利用屬性列跨度和行跨度。

例子。

使以下結構：

------- 
|A | 
------- 
|X|Y|Z| 
    ----- 
| |1|2| 
------- 

使用的代碼：

<tr> 
    <td colspan="3">A</td> 
</tr> 
<tr> 
    <td rowspan="2">X</td> 
    <td>Y</td> 
    <td>Z</td> 
</tr> 
<tr> 
    <td>1</td> 
    <td>2</td> 
</tr> 

另一種方法是爲一前一後的建議，增加一個嵌套表如下：

<tr> 
    <td>A</td> 
</tr> 
<tr> 
    <table> 
     <tr> 
      <td>X</td> 
      <td>Y</td> 
      <td>|</td> 
     </tr> 
    </table> 
</tr> 

就我個人而言，我會選擇colspan路線，但它真的取決於你。

另一條路線是完全忽略表格和使用CSS，但你很可能會發現這種痛苦得多，除非你已經在使用CSS competenent。

Answer 5

盡我所能：

<table border="1"> 
<tr> 
    <td colspan="3">aaa</td> 
    <td colspan="3">aa</td> 
</tr> 
<tr> 
    <td>a</td> 
    <td> aa </td> 
    <td> aaa </td> 
    <td>lol</td> 
    <td> 
     <table border="1"> 
      <tr> 
       <td colspan="3"> 
        lol 
       </td> 
      </tr> 
     <tr> 
      <td> 
       ok 
      </td> 
      <td> 
       ok 
      </td> 
      <td> 
       ok 
      </td> 
     </tr> 
     <tr> 
      <td> 
       ok 
      </td> 
      <td> 
       ok 
      </td> 
      <td> 
       ok 
      </td> 
     </tr> 
     </table> 
    </td> 
    <td> 

    </td> 
</tr> 
    <tr> 
     <td colspan="2"> 
     </td> 
     <td> 
     </td> 
     <td> 
     </td> 
     <td> 
     </td> 
     <td> 
     </td> 
    </tr> 
    <tr> 
     <td colspan="10"> 
     </td> 
    </tr> 

</table> 

http://jsfiddle.net/jsTvA/15/

Answer 6

<table border="1"> 
    <tr> 
     <td colspan="3">aaa</td> 
     <td colspan="5">aa</td> 
    </tr> 
    <tr> 
     <td rowspan="3">a</td> 
     <td rowspan="3">aa</td> 
     <td rowspan="3">aa</td> 
     <td rowspan="3">aa</td> 
     <td colspan="3">aa</td> 
     <td rowspan="3">aa</td> 
    </tr> 
    <tr> 
     <td>bb</td> 
     <td>bb</td> 
     <td>bb</td> 
    </tr> 
    <tr> 
     <td>bb</td> 
     <td>bb</td> 
     <td>bb</td> 
    </tr> 
    <tr> 
     <td>aa</td> 
     <td>aa</td> 
     <td>aa</td> 
     <td>aa</td> 
     <td>aa</td> 
     <td>aa</td> 
     <td>aa</td> 
     <td>aa</td> 
    </tr> 
    <tr> 
     <td colspan="8">aa</td> 
    </tr> 
</table> 

Answer 7

您可以嘗試在Excel中合併單元格，然後將其轉換爲html。 http://tableizer.journalistopia.com