如何在Bootstrap 2表单中排列标签和只读字段

Question

在bootstrap 2中，以表格排列标签和只读文本字段的推荐方式。以下代码示例创建未对齐的字段：

<form class="form-horizontal">
    <fieldset>
        <legend>Sample</legend>    
        <div class="control-group">
            <label class="control-label">Readonly Field</label>
            <div class="controls">
                Lorem Ipsum and then some
            </div>
        </div>
    </fieldset>
</form>

请注意，我可以使用自定义CSS修复此问题。那不是问题。这似乎很愚蠢，这不是内置的，所以我觉得我必须忽略一些东西。

Answer 1

您可以使用不可编辑的输入

<span class="input-xlarge uneditable-input">Lorem Ipsum and then some</span>

编辑：

从bootstrap 3.0开始，已经添加了一个类来处理这个

  

当您需要在表单标签旁边放置常规静态文本时   在水平表单中，使用.form-control-static

上的<p>类

<div class="controls">
  <p class="form-control-static">Lorem Ipsum and then some</p>
</div>

Answer 2

有一个黑客。您可以使用＆lt; label＆gt;使用“复选框”类

在你的情况下：

<div class="controls">
 <label class="checkbox">
     Lorem Ipsum and then some
 </label>
</div>

Answer 3

从bootstrap 4.0开始，.form-control-static类已被.form-control-plaintext类取代。