Question

在bootstarp中输入以下文本之间需要水平空间。

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container">
  <div class="col-md-12">
    <div class="col-sm-6 col-lg-4">
      <div class="form-group">
        <!-- <div class="col-md-8"> -->
        <input class="col-xs-3-offset-4" id="inputdefault" type="text" placeholder="AWB ID" style="background-color:#DCDCDC; height:40px">
        <!-- </div> -->
      </div>
    </div>

    <div class="col-sm-6 col-lg-4"> 
      <div class="form-group">
      <!-- <div class="col-md-8"> -->
        <input class="col-xs-4-offset-6" id="inputdefault" type="text" placeholder="Enter Your Traking Information..." style="background-color:#DCDCDC; height:40px;">
      <!-- </div> -->
      </div>
    </div>
   </div>
</div>

＆＃13;

怎么做得好呢。 Html空格不起作用。

Answer 1

我想你想要这样

＆＃13;

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<style>
.form-inline .form-group {
    display: inline-block;
    margin-bottom: 0;
    vertical-align: middle;
}
.form-inline .form-control {
    display: inline-block;
    margin-bottom: 0;
    vertical-align: middle;
}
.form-inline .form-group { margin-right:20px;}
</style>

<form class="form-inline" role="form">
    <div class="form-group">
      <label for="email2">Email:</label>
      <input type="email" class="form-control" id="email2" placeholder="Enter email">
    </div>
    <div class="form-group">
      <label for="pwd2">Password:</label>
      <input type="password" class="form-control" id="pwd2" placeholder="Enter password">
    </div>
    <div class="checkbox">
      <label><input type="checkbox"> Remember me</label>
    </div>
    <button type="button" class="btn btn-default">Submit</button>
  </form>

＆＃13;

Answer 2

如果我没有错，这将有效，

＆＃13;

.container{
  margin-left: 100px;
}

＆＃13;

<div class="container">
  <div class="col-md-12">
    <div class="col-sm-6 col-lg-4">
      <div class="form-group">
        <!-- <div class="col-md-8"> -->
        <input class="col-xs-3-offset-4" id="inputdefault" type="text" placeholder="AWB ID" style="background-color:#DCDCDC; height:40px">
        <!-- </div> -->
      </div>
    </div>
    <br>
    <br>
    <div class="col-sm-6 col-lg-4"> 
      <div class="form-group">
      <!-- <div class="col-md-8"> -->
        <input class="col-xs-4-offset-6" id="inputdefault" type="text" placeholder="Enter Your Traking Information..." style="background-color:#DCDCDC; height:40px;">
      <!-- </div> -->
      </div>
    </div>
   </div>
</div>

＆＃13;

如何在bootstrap中的两个文本输入之间自定义空间

2 个答案: