Question

我想在同一行登录，密码和提交。

<p><input type="text" name="login" value="" placeholder="Username or Email"><input type="password" value="" placeholder="Password"></p><p class="submit"><input type="submit" name="commit" value="Login"></p>

Answer 1

您始终可以使用span在一个段落标记

中添加不同的类

例如：

<p><span class="1">First Item</span> <span class="2">Second Item</span></p>

但是，听起来您希望在input中使用需要提交数据的form字段。在这种情况下，您所要做的就是： https://jsfiddle.net/fNPvf/25012/

Answer 2

您可以通过添加显示 css属性来内联（在同一行）HTML元素：

display:inline-block;

＆LT;输入＆gt;元素默认为内联块显示。但是＆lt; p>元素默认为块显示;这意味着他们在元素之后有一个断裂线。

但是，鉴于您似乎不熟悉HTML和CSS，我强烈建议您查看Boostrap。它是一个使网站样式和模板更容易的框架。这就是为什么在您的来源中＆lt; p>在呈现提交输入之前，围绕两个输入会分成一个新行。

请参阅their documentation中有关如何制作内嵌登录表单的摘录。在整页模式下运行此代码段，看看它是如何在线工作的。

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<form class="form-inline">
      <div class="form-group">
        <label class="sr-only" for="exampleInputEmail3">Email address</label>
        <input type="email" class="form-control" id="exampleInputEmail3" placeholder="Email">
      </div>
      <div class="form-group">
        <label class="sr-only" for="exampleInputPassword3">Password</label>
        <input type="password" class="form-control" id="exampleInputPassword3" placeholder="Password">
      </div>
      <div class="checkbox">
        <label>
          <input type="checkbox"> Remember me
        </label>
      </div>
      <button type="submit" class="btn btn-default">Sign in</button>
    </form>

＆＃13;

如何在同一行上获得具有不同类的两个段落标记？

2 个答案: