HTML 缩进 table

Question

我的 HTML 代码如下所示：

<style type="text/css">
<!--
    td.indent    {text-indent:10mm; }
//-->
</style>

[...]

<table>
    <tr>
        <td class="indent"> Long line of text </td>
        <td class="indent"> Some other text </td>
    </tr>
</table>

并且 table 中的输出文本按预期缩进：

              Long line of text

但是，当我尝试使用 <br> 添加换行符时：

<td class="indent"> Long line of<br> text </td>

只缩进了<br>之前的部分：

              Long line of
text

如何让输出看起来像这样？

              Long line of
              text

Answer 1

您可以使用 padding-left 而不是 text-indent。

td.indent {
  padding-left: 10mm;
}

<table>
  <tr>
    <td class="indent"> Long line of<br> text </td>
  </tr>
</table>

HTML indentatinon in table