如何更改引导标签和输入之间的距离

时间:2014-10-25 17:27:01

标签: css twitter-bootstrap-3

我正在尝试更改标签和输入之间的距离(2之间的距离更短)。我还希望标签彼此正确对齐。我找到了一些我正在寻找的例子,但是我无法让它发挥作用。您还会看到两组" City / St / Zipcode。我希望这些在同一行,我所看到的一切都说在表单标签中使用内联表单。我的问题是,当我的整个模态是一个形式时,我该怎么做?你可以在单个提交的表格中有表格吗? 这是我在一个傻瓜中的模态 myPlunkr

 <div class="form-group clearfix">
     <label class="col-sm-3 control-label">Name</label>
       <div class="col-sm-9">
         <input ng-model="job.name" type="text" class="form-control input-md">
       </div>
  </div>

这是一个小提示,显示我希望标签如何正确对齐以及标签和输入之间的距离 fiddle

<div class="form-group">
    <label for="gender" class="col-sm-4 control-label col-sm-pad">Gender:</label>
        <div class="col-sm-8 col-sm-pad">
            <input class="form-control input-block" name="gender" type="text">                      
         </div>
</div>

这是一个小提示,显示我希望City / St / Zipcode如何内联 fiddle

<form class="form-inline" role="form">
 <div class="form-group">
  <label class="sr-only" for="timezone">Timezone</label>
   <select class="form-control" id="timezone" name="timezone">
  <option value="America/St_Lucia">America/St_Lucia</option>
  <option value="Europe/Nicosia">Europe/Nicosia</option>
 </select>
</div>

<label class="radio-inline">
  <input id="timeformat-0" name="timeformat" value="24" type="radio" />
  19:00
</label>

<label class="radio-inline">
 <input checked id="timeformat-1" name="timeformat" value="12" type="radio" />
   7:00 PM
</label>

 <button class="btn" type="submit">Save</button>
</form>

更新: * =(空格) 而不是这个标签**********输入。我想要这个,标签***输入

1 个答案:

答案 0 :(得分:1)

我无法完全理解你想要的东西..

如果你想要空格b / w标签和输入字段,那么添加br标签,如...

  <input id="timeformat-0" name="timeformat" value="24" type="radio" />
  19:00
</label>
<br/>
<label class="radio-inline">
 <input checked id="timeformat-1" name="timeformat" value="12" type="radio" />
   7:00 PM
</label>

如果你想要它在右侧,那么添加这个类。

pull-right