html - 在 html 中组织我的文本字段

Question

尝试按照我想要的方式组织我的文本字段。 我想要的是: - 顶部的用户名字段 -名字和姓氏在下面并彼此相邻 -密码和确认在名字下面并且彼此相邻

我是 html 的新手，在组织它时遇到了麻烦。不确定使用 div、section 等。

还希望所有内容都居中而不是左对齐，我想在所有文本字段下方添加一个图像，并在其下方添加子元素 btn。

代码如下:

<form>

                <label-popup for="contact">
                <span-popup>USERNAME *</span-popup>
                <input type="text" id="contact" />
                </label-popup>

                </form>

                <form>
                <div>
                <label-popup for="company">
                <span-popup>FIRST NAME *</span-popup>
                <input type="text" id="company" />
                </label-popup>

                <label-popup for="contact">
                <span-popup>LAST NAME *</span-popup>
                <input type="text" id="contact" />
                </label-popup>

                <label-popup for="contact">
                <span-popup>PASSWORD *</span-popup>
                <input type="text" id="contact" />
                </label-popup>

                <label-popup for="contact">
                <span-popup>CONFIRM PASSWORD *</span-popup>
                <input type="text" id="contact" />
                </label-popup>
                </div>
                </form>

Answer 1

我会建议您使用表格而不是 div 或部分，这对您来说很容易。 我将为您的设计提供简单的表结构。

  <table border="0" align="center">
     <tr>
        <td>User Name <input type="text" /></td>
     </tr>
     <tr>
        <td>First Name <input type="text" /> </td>
        <td>Last Name  <input type="text" /> </td>   
    </tr>
  </table>

现在在此表中添加您的字段。