带有扩展列的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表格

回答

相关问题