Question

我正在设计一个HTML电子邮件。我有一个图像，顶部和底部有一个段落。这3个在表格单元格内。我需要将图像放在单元格的中心，并且2段应该与图像垂直等距。

<td height="200" style="vertical-align:middle;">
  <p style="vertical-align:middle;">Lorem Ipsum</p>
  <img src="pic.jpg" height="150" />
  <p style="vertical-align:middle;">Lorem Ipsum</p>
</td>

现在3没有垂直对齐。如何使它们在垂直方向上相等的空间对齐？

Answer 1

这种方式很好用：

<style>
    td {
        vertical-align:middle;
    }
</style>

HTML：

<table>
    <tr>
        <td>
            <p>Lorem Ipsum</p>
        </td>
        <td>
            <img src="http://lorempixel.com/output/food-h-c-100-200-8.jpg" alt="">
        </td>
        <td>
            <p>Lorem Ipsum</p>
        </td>
    </tr>
</table>

表格单元格中的相等垂直间距

1 个答案: