Question

我是HTML对齐的新手。我有三个输入字段，但它们没有正确对齐。

<form>
username:<input type="text" name="username" value="ENTER NAME HERE" /><br>
id:<input type="text" name="id" value="ENTER ID HERE" /><br>
age:<input type="text" name="age" value="ENTER AGE HERE" />
</form>

请帮助我使用colspan或rowspan对齐，以便输入字段看起来很好。

Answer 1

试试这个.. 它可以像HTML对齐vise一样正常工作

 <form>
<div style="width:300px">
<div style="float:left">username:</div><div style="float:right"><input type="text" name="username" value="ENTER NAME HERE" /></div><br>
<div style="float:left">id:</div><div style="float:right"><input type="text" name="id" value="ENTER ID HERE" /></div><br>
<div style="float:left">age:</div><div style="float:right"><input type="text" name="age" value="ENTER AGE HERE" /></div>
</div>
</form>

Answer 2

试试这个：

<div id="userdata">
<div><label>Enter Name</label><input type="text" /></div>
<div><label>Enter Id</label><input type="text" /></div>
<div><label>Enter Age</label><input type="text"/></div>
</div>

Answer 3

在表格中使用它们：

<div id="userdata">
  <table>
    <tr>
        <td>Enter Name</td><td><input type="text" /></td>
    </tr>
    <tr>
        <td>Enter ID</td><td><input type="text" /></td>
    </tr>
    <tr>
        <td>Enter Age</td><td><input type="text" /></td>
    </tr>
  </table>
</div>

正确对齐HTML标记

3 个答案: