DIV 中的 HTML 表格未正确对齐文本

Question

我正在尝试将表格单元格中的文本右对齐，但出于某种原因，我无法正常工作。

我的代码是这样的

<div style="text-align: right;">
    <table>
         <tr>
             <td>15</td>
         </tr>
         <tr>
             <td>20</td>
         </tr>
    </table>
</div>

为什么这不能使文本右对齐？

请注意，我没有使用单独 CSS 的选项，它必须按照上述方式“内联”。

Answer 1

这是带有一行较长文本的表格。您会看到文本完全右对齐，但表格不是全宽。

<div style="text-align: right;">
  <table>
    <tr>
      <td>15</td>
    </tr>
    <tr>
      <td>20</td>
    </tr>
    <tr>
      <td>Something longer</td>
    </tr>
  </table>
</div>

这里是使表格全宽的更正。

    <div style="text-align: right;">
      <table width="100%">
        <tr>
          <td>15</td>
        </tr>
        <tr>
          <td>20</td>
        </tr>
        <tr>
          <td>Something longer</td>
        </tr>
      </table>
    </div>

width="100%" 是内联的，但不是 CSS。如果你想要它的 CSS，那么这样做:

        <div style="text-align: right;">
          <table style="width:100%">
            <tr>
              <td>15</td>
            </tr>
            <tr>
              <td>20</td>
            </tr>
            <tr>
              <td>Something longer</td>
            </tr>
          </table>
        </div>