Question

到目前为止，这是我的代码：

<form>
    <p>Username: </p><input type="text" name="username" />
    <p>Password: </p><input type="text" name="password" />
    <br /><input type="submit" value="Submit" />
</form>

由于一些有趣的原因，它将转到另一行的段落和文本框。我该怎么做才能防止这种情况？

Answer 1

也可以在输入中放置段落标记。 P标签基本上在它自己的末尾进行换行。

<form>
    <p>Username: <input type="text" name="username" /></p>
    <p>Password: <input type="text" name="password" /></p>
    <br /><input type="submit" value="Submit" />
</form>

Answer 2

这样做：

<form>
    Username: <input type="text" name="username" />
<br/>
    Password: <input type="text" name="password" />
<br /><input type="submit" value="Submit" />
</form>

或

<form>
    Username:<br/> <input type="text" name="username" />
<br/>
    Password:<br/> <input type="text" name="password" />
<br /><input type="submit" value="Submit" />
</form>

Answer 3

<form>
  <div style="float: left;">Username: <input type="text" name="username" /></div>
  <div style="float: left;">Password: <input type="text" name="password" /></div>
  <div style="clear: both;"></div>
  <input type="submit" value="Submit" />
</form>

Answer 4

由于你的加价，他们正在降线。段落（<p>）标记会删除一个新行，就像中断（<br>）一样。我建议使用<span>标记代替段落标记，然后删除换行符。

Answer 5

p标签默认为“display：block”，表示＆lt; br /＆gt;在浏览器添加p之前和之后，它是进入下一行的原因。

包括标签和＆amp; “p”中的文本框

<form>
<p>Username: <input type="text" name="username" /></p>
<p>Password: <input type="text" name="password" /></p>
<p><input type="submit" value="Submit" /></p>
</form>

如何使这个HTML代码不转到另一行

5 个答案: