用不同的填充在HTML中嵌套表格

Question

我正在尝试创建下表：

---

我似乎无法使内部表嵌套在外部表中。表格是使用的正确工具，还是有其他工具可以让我执行此类操作？我读过我可以使用样式，然后根据像素手动对其进行定位，但这似乎不是一个好的解决方案。

这就是我所拥有的（注意：内部表就是问题）

            <table>
                <tbody>
                    <tr>
                        <td>field_A </td>
                        <td><input type="text"></td>
                    </tr>

                    <tr>
                        <td> 
                            [optional]
                            <input type="text"> 
                        </td>

                        <td>
                            [optional]
                            <input type="text">
                        </td>
                    </tr>

                    <tr>
                        <td>field_D </td>
                        <td><input type="text"></td>
                    </tr>
                </tbody>
            </table>

Answer 1

您的问题中只有一张桌子。我想您想要这样的东西：

<table>
  <tbody>
    <tr>
      <td>field_A </td>
      <td><input type="text"></td>
    </tr>
    <table style="position: relative; left: 25px;">
      <tr>
        <td>
          [optional]
          <input type="text">
        </td>

        <td>
          [optional]
          <input type="text">
        </td>
        <tr>
          <td>
            [optional]
            <input type="text">
          </td>

          <td>
            [optional]
            <input type="text">
          </td>
        </tr>
    </table>

    <tr>
      <td>field_D </td>
      <td><input type="text"></td>
    </tr>
  </tbody>
</table>

这会将表格嵌套在另一个表格中，并使其缩进（基于提供的图片）。