Question

我有一些主要由输入控件组成的表单，但有时水平表单有如下变量：

<div class="form-group">
   <span class="col-md-3 control-label">Features</span>
   <div class="col-md-9">
     <span>This is not available.</span>
   </div>
</div>

或者有时我有多个控件：

<span class="col-md-3 control-label">Payment</span>
<div class="col-md-9">
  <input value="2" name="CustomerPaymentOption" type="radio">
  <span>Credit Card</span>
</div>

标签内容与控件标签的排列水平不同。我试图模仿css类进行表单控制以获得排列内容，但它在我的场景中从未如此完美。关于让内容排队的任何建议？

Answer 1

如果您只想打印静态文本，可以使用静态表单控件（http://getbootstrap.com/css/#forms-controls-static）。

如果要使用多个复选框和单选按钮，还可以使用bootstrap provoides。请参阅http://getbootstrap.com/css/#forms-controls。

你想要这样的东西吗？ http://www.bootply.com/ztbj1dCJrP

Answer 2

它的简单添加类到div（这里是my-label）

<span class="col-md-3 control-label">Payment</span>
<div class="col-md-9 my-label">
  <input value="2" name="CustomerPaymentOption" type="radio">
  <span>Credit Card</span>
</div>

和css

.my-label{
    display:inline-block;
}

小提琴http://jsfiddle.net/harshdand/a4n4nc1r/

表示多个http://jsfiddle.net/harshdand/a4n4nc1r/2/

Bootstrap水平表单中的替代HTML样式

2 个答案: