帶有擴展列的HTML表格

我不確定是否有辦法做到這一點，截至目前，我正在考慮以絕對定位製作一個單獨的元素，並將其置於適當的位置。帶有擴展列的HTML表格

這就是我想要做的事......這甚至有可能嗎？現在我有桌子，你可以看到右邊的一部分，但我只是想設法做到這一點。

extended column

我有一個正常的表格佈局，截至目前：但看看小提琴：http://jsfiddle.net/W3Tvm/

我猜主要的挑戰將試圖保持border-radius

<table class="overviewTable"> 
      <thead> 
       <tr> 
        <th colspan="5"> 
         FAN FREE TERMINALS</th> 
       </tr> 
      </thead> 
      <thead class="posiOverviewPN"> 
       <tr> 
        <th class="txHeader"> 
         TX4200E</th> 
        <th class="ksHeader"> 
         KS6700</th> 
        <th class="ksHeader"> 
         KS7200</th> 
        <th class="ksHeader"> 
         KS7500</th> 
        <th class="ksHeader"> 
         KS7700</th> 
       </tr> 
      </thead> 
      <tbody> 
       <tr> 
        <td> 
         <img height="68px" src="../posiflex/images/tx-4200.png" width="120px"></td> 
        <td> 
         <img height="108px" src="../posiflex/images/ks6700.png" width="120px"></td> 
        <td> 
         <img height="109px" src="../posiflex/images/ks7200.png" width="120px"></td> 
        <td> 
         <img height="117px" src="../posiflex/images/ks7500.png" width="120px"></td> 
        <td> 
         <img height="119px" src="../posiflex/images/ks7700.png" width="120px"></td> 
       </tr> 
      </tbody> 
     </table>

來源

2013-12-12 Adjit

發表你已經有的代碼，所以我們可以看到你已經嘗試過。 –

爲什麼是有可能的。 – TreeTree

@CTravel我的代碼只是一個簡單的表格佈局。沒有做任何特別的事情。但檢查原始帖子的小提琴。 – Adjit

我相信你想要做的是基本的表結構：http://jsfiddle.net/9VULt/

所有你需要做的是有空th/td單元格：

<table> 
    <thead> 
     <tr> 
      <th><!--empty--></th> 
      <th>TX42</th> 
     </tr> 
     <tr> 
      <th><!--empty--></th> 
      <th>image</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td>Advantage</td> 
      <td>Industrial grade...</td> 
     </tr> 
    </tbody> 
</table>

來源

2013-12-12 19:32:18

看看小提琴......我希望它是這樣簡單 – Adjit

您想要的所有東西都可以用普通的HTML表格和CSS樣式完成。請參閱[鏈接]（http://jsfiddle.net/9VULt/3/） –

感謝您的幫助。剛剛學習'：not'語句 – Adjit

帶有擴展列的HTML表格

回答

相關問題