Question

在一篇示例文章中，我添加了一个html表，其中包含2列，左列用于图像，右列用于图像描述。

问题是，右栏上的文字描述位于图像下方，就像图像强制文本分成另一行一样。

这是我使用的示例代码：

<table>
<tr>
<td>Image.jpg</td>
<td>Image.jpg description</td>
</tr>
<tr>
<td>Image2.jpg</td>
<td>Image2.jpg description</td>
</tr>
</table>

您可以在此处查看问题On this page

Answer 1

您只需将style="vertical-align:top"添加到td

即可

或vertical-align:middle如果您想将文字放在行的中间

Answer 2

在文本<TD>中尝试此CSS：

vertical-align:top;

即：

<td style="vertical-align:top;">
   Trio: Quaisquer três cartas do mesmo valor. Este exemplo ...
</td>

Answer 3

那么要理解你想让照片和文字对齐正确吗？你能使用valign属性吗？

<table>
<tr>
 <td valign="top">January</td>
 <td valign="top">$100</td>
</tr>
<tr> 
<td valign="bottom">February</td>
 <td valign="bottom">$80</td>
   </tr>
</table>

应使用顶部，底部和中心，具体取决于您希望它如何对齐。

HTML表格对齐图像和文本

3 个答案: