在表格中，如何在单个单元格中嵌套多行单元格？

问题描述：

我的表格由6列和5行组成。在每一行中，第五列需要保存多个单元堆叠在一起。有没有一种方法可以做到这一点，而不需要在每行的第5列中嵌套新表格？在表格中，如何在单个单元格中嵌套多行单元格？

<tr> 
     <td><img class="image" src="Posters/suicidesquad-poster1.jpg"></td> 
     <td>Suicide Squad</td> 
     <td>PG-13</td> 
     <td>2 Hour(s) 3 Minutes</td> 
     <!-- Here I need to add two rows within the 5th column 

      <td>Row One </td> 
      <td>Row Two </td> 

     The sixth column will be the same as the others --> 

     <td>CC, DV</td> 
     </tr>

现在你有一个答案，想想_why_你想它分裂这样。第5列中的数据的结构是什么？使用包含2个div的单个“td”_may_可以更恰当地表示数据，并且可以轻松地将这些数据堆叠在表格单元格中。首先获取_structure_权利，然后让它看起来像你想用CSS的方式;不要把注意力集中在一开始就看 - 你可能最终会得到一些长期不能维持的东西。 –

答

是您使用col-span或row-span

<table> 
    <tr> 
     <td rowspan="2">Two High</td> 
     <td rowspan="2">Two High</td> 
     <td>Single</td> 
    </tr> 
    <tr> 
     <td>Single</td> 
    </tr> 
</table>

这会给你想要的效果，在现实中“合并” <td>的一起，同时保留您希望出现奇异的人。

查看here了解有关此属性的更多信息。

这几乎可以工作，但是我的第六列现在已经连续成立 – Sidward

现在，如果整个事情都是5高的，那么给这个人添加'rowspan = 5'。请记住，在使用此功能时，请将您的行统计为单数。如果某行的行跨度为2，则表示为2行。 – Illdapt

答

你可以把2周的div到每个那些TD的：

<tr> 
    <td><img class="image" src="Posters/suicidesquad-poster1.jpg"></td> 
    <td>Suicide Squad</td> 
    <td>PG-13</td> 
    <td>2 Hour(s) 3 Minutes</td> 
    <td> 
     <div class="my_extra_cells">Row One</div> 
     <div class="my_extra_cells">Row Two </div> 
    </td> 
    <td>CC, DV</td> 
</tr>

只需创建一个CSS规则.my_extra_cells把它看成你喜欢。

请注意：我在代码中更改了一些细节（我之前有5栏，现在是6） – Johannes

答

如果你想使用rowspan代替divs，我相信你想这样的：

<table border="1"> 
 
    <tr> 
 
    <td rowspan="2"> 
 
     <img class="image" src="Posters/suicidesquad-poster1.jpg"> 
 
    </td> 
 
    <td rowspan="2">Suicide Squad</td> 
 
    <td rowspan="2">PG-13</td> 
 
    <td Rowspan="2">2 Hour(s) 3 Minutes</td> 
 
    <td>Row One</td> 
 
    <td rowspan="2">CC, DV</td> 
 
    </tr> 
 
    <tr> 
 
    <td>Row Two</td> 
 
    </tr> 
 
</table>

雅这个问题对我来说不是很清楚，但我敢打赌，OP在寻找什么。 – dippas

谢谢。这正是我所期待的 – Sidward

在表格中，如何在单个单元格中嵌套多行单元格？

相关推荐