如何使用twitter bootstrap正确格式化表单

Question

我理解有课程.form-inline和.form-horizontal课程等但这引出了一些问题:

1. 这些似乎只与标签如何与其对应的文本字段/复选框等对齐.这是正确的吗？
2. 我需要创建一个包含以下内容的表单:
   • 潜在的很多领域和
   • 将它们与bootstrap 12 col网格对齐.

我是否需要将每个字段及其标签包装在一个中div,并给出div一个类名,例如span3？

Answer 1

你的问题不是那么明确..无论如何我会试着回答它!
你想如何通过页面处理输入元素？

以下是两个HTML代码段,它们创建了两种形式.第一种是内联形式,其中所有输入都在同一行上.第二种是水平形式,它将表格分成两部分,左边是保持标签,右边是包含输入元素.

<form class="form-inline">
    <label>Input One: </label><input type="text" placeholder="Input One" />
    <label>Input Two: </label><input type="password" placeholder="Input Two" />
    <input type="submit" value="Submit" />
</form>

<form class="form-horizontal">
    <fieldset>
        <div class="control-group">
            <label class="control-label" for="input1">Input One:</label>
            <div class="controls">
                <input id="input1" type="text" placeholder="Input One" />
            </div>
        </div>
        <div class="control-group">
            <label class="control-label">Input Two:</label>
            <div class="controls">
                <input type="text" placeholder="Input Two" />
            </div>
        </div>

        <div class="control-group">
            <label class="control-label">Submit</label>
            <div class="controls">
                <input type="submit" value="Submit" />
            </div>
        </div>
    </fieldset>
</form>?

如果你可以更具体,我会很乐意帮助你.