如何格式化HTML表格，以便我可以在具有rowspan = 2屬性的單元格中插入額外的單元格？

Question

我正在嘗試創建一個表格，我可以將webparts插入到這樣的表格中。

我目前的代碼是

<table border="1">
 <tr>
   <td>Clk Map</td>
   <td rowspan="2">
   ///extra in here
   </td>
 </tr>
 <tr>
   <td>ImgeCar</td>
 </tr>
</table>

當我嘗試這個時，它完全崩潰了。

<table border="1">
 <tr>
  <td>Clk Map</td>
  <td rowspan="2">
   <tr>
    <td>a</td>
    <td>b</td>
    <td>c</td>
   </tr>
  </td>
 </tr>
 <tr>
  <td>ImgeCar</td>
 </tr>
</table>

Answer 1

就像Mituw16所提到的...對於像你提議的那樣的數據展示......沒有規范化表格結構的東西，你應該在沒有表格的情況下這樣做。

將點擊地圖和圖像輪播放在DIV或左邊的類似容器中的東西......向左浮動，然后將新聞項目放在右邊的容器中，向左浮動。 這將允許右側內容“增長”，而不必處理連續添加的rowspan會計。

<div id="holdme">
    <div id="lcol">
        <div id="clickmap">CLICK MAP</div>
        <div id="carousel">CAROUSEL</div>
    </div>
    <div id="rcol">
        <div class="newsitem">News Item</div>
      ...
        <div class="newsitem">News Item</div>
    </div>
</div>

請參閱以下http://jsfiddle.net/J9543/

Answer 2

這是你的問題的快速解決方案 - 在這里看到它（你缺少一個表元素）

<table border="1">
 <tr>
  <td>Clk Map</td>
  <td rowspan="2">
   **<table>**
    <tr>
     <td>a</td>
     <td>b</td>
     <td>c</td>
    </tr>
   **</table>**
  </td>
 </tr>
 <tr>
  <td>ImgeCar</td>
 </tr>
</table>

在第二個想法， 這將更接近你在模型中的要求：

<table border="1">
 <tr>
  <td>Clk Map</td>
  <td rowspan="2">
   **<table>**
    <tr>
     <td>a</td>
    </tr>
    <tr>
     <td>b</td>
    </tr>
    <tr>
     <td>c</td>
    </tr>
   **</table>**
  </td>
 </tr>
 <tr>
  <td>ImgeCar</td>
 </tr>
</table>

但是，請考慮學習css（尤其是本例中的float），這是解決問題的正確方法。 從長遠來看，它將極大地幫助你。