Html 将表格列和行并排对齐以便打印
我有一个表格网格布局,我已经为打印做好了准备,但是我在尝试将缩略图图像向左对齐,然后沿着缩略图旁边的一侧对齐两行时遇到了问题 我不知道如何最好地使用表来正确对齐,因为我已经习惯使用div了 我这里有以下代码:- 所以基本上[第一行和第二行]需要像第一张桌子一样,但在左边的图像旁边,此时我的一直坐在它下面 任何帮助都将是伟大的,小提琴更好地证明了这一点Html 将表格列和行并排对齐以便打印,html,css,printing,html-table,Html,Css,Printing,Html Table,我有一个表格网格布局,我已经为打印做好了准备,但是我在尝试将缩略图图像向左对齐,然后沿着缩略图旁边的一侧对齐两行时遇到了问题 我不知道如何最好地使用表来正确对齐,因为我已经习惯使用div了 我这里有以下代码:- 所以基本上[第一行和第二行]需要像第一张桌子一样,但在左边的图像旁边,此时我的一直坐在它下面 任何帮助都将是伟大的,小提琴更好地证明了这一点 <table width="100%" border="0" cellspacing="0" cellpadding="0">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td width="30%" class="bottom_bdr stocklistItemImage">
<img height="75" width="100" class="stocklist_thumb"
border="2" src="http://upload.wikimedia.org/wikipedia/commons/thumb/5/5d/Funivia_Rote_Nase_alt.JPG/300px-Funivia_Rote_Nase_alt.JPG"
alt="">
</td>
</tr>
<tr>
<td width="70%" class="vfeatures bdrBottom">
<span style="font-weight:bold">FIRST LINE:</span> Seatis, Seatis, Seatis, Seatis, Seatis, Seatis, Seatis
</td>
</tr>
<tr>
<td width="70%" class="bottom_bdr a_top stocklistItemDescription">
<span style="font-weight:bold">SECOND LINE</span> Seatis, Seatis, Seatis, Seatis, Seatis, Seatis, Seatis
</td>
</tr>
<tr>
<td class="" width="70%"> </td>
</tr>
</tbody>
</table>
第一行:Seatis,Seatis,Seatis,Seatis,Seatis,Seatis,Seatis
第二线肖蒂斯,肖蒂斯,肖蒂斯,肖蒂斯,肖蒂斯,肖蒂斯,肖蒂斯
您需要对HTML表格的工作原理有一个基本的了解<代码>表示“表格行”,或表格中单元格的水平对齐
因此,为了使文本位于图像的右侧,需要将它们放在同一行中。但是,看起来您希望两行(第一行和第二行)都与图像位于同一行中。通过将第一个
(图像)上的行span
设置为2
,将第一行放置在与图像相同的
中,然后将第二行放置在新的
中,可以完成此操作
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td width="30%" class="bottom_bdr stocklistItemImage" rowspan="2>
<img height="75" width="100" class="stocklist_thumb" border="2" src="http://upload.wikimedia.org/wikipedia/commons/thumb/5/5d/Funivia_Rote_Nase_alt.JPG/300px-Funivia_Rote_Nase_alt.JPG" alt="">
</td>
<td width="70%" class="vfeatures bdrBottom">
<span style="font-weight:bold">FIRST LINE:</span> Seatis, Seatis, Seatis, Seatis, Seatis, Seatis, Seatis
</td>
</tr>
<tr>
<!--No first cell here; it's already covered by the image td with the rowspan="2" -->
<td width="70%" class="bottom_bdr a_top stocklistItemDescription">
<span style="font-weight:bold">SECOND LINE</span> Seatis, Seatis, Seatis, Seatis, Seatis, Seatis, Seatis
</td>
</tr>
</tbody>
</table>