css - 如何在引导表单上正确对齐没有标签的字段

Question

我有

<form action="#" method="post" class="well">
    <fieldset>
        <div class="control-group">
            <label class="control-label" for="FirstName">Name</label>
            <div class="controls row-fluid">
                <div class="span2 row">
                    <input class="span12" id="FirstName" name="FirstName" placeholder="Firstname" type="text" value=""/>
                </div>
                <div class="span2 row">
                    <input class="span12" id="MiddleName" name="MiddleName" placeholder="Middlename" type="text" value=""/>
                </div>
                <div class="span2 row">
                    <input class="span12" id="LastName" name="LastName" placeholder="Lastname" type="text" value=""/>
                </div>
            </div>
        </div>
    </fieldset>
</form>

jsfiddle：http: //jsfiddle.net/bWGfb/

我想为姓氏添加标签，所以我只想为名字和姓氏添加标签。引导程序怎么可能？

更新： 我可以做这样的事情：

<div class="row-fluid">
    <div class="span12">
        <div class="span4">
            <label>First Name</label>
            <input type="text" class="span12" placeholder="First Name">
        </div>
        <div class="span4" style="margin-top: 25px;">
            // field without label
            <input type="text" class="span12" placeholder="Last Name">
        </div>
        <div class="span4 ">
            <label>First Name</label>
            <input type="text" class="span12" placeholder="Last Name">
        </div>
    </div>
</div>
​

http://jsfiddle.net/bWGfb/1/

但它增加了额外的边距样式。

Answer 1

像这样的东西：

<form action="#" method="post" class="well">
    <fieldset>
        <div class="control-group">
            <div class="row-fluid">
                <div class="span3">
                    <label for="FirstName">First name</label>
                    <input class="span12" id="FirstName" name="FirstName" placeholder="Firstname" type="text" value=""/>
                </div>
                <div class="span3">
                    <label for="MiddleName">&nbsp;</label>
                    <input class="span12" id="MiddleName" name="MiddleName" placeholder="Middlename" type="text" value=""/>
                </div>
                <div class="span3">
                    <label for="LastName">Last name</label>
                    <input class="span12" id="LastName" name="LastName" placeholder="Lastname" type="text" value=""/>
                </div>
            </div>
        </div>
    </fieldset>
</form>

Answer 2

只需在您自己的 CSS 中覆盖（第 946 行）中的label样式bootstrap.css

它有5px底部边距，只需将其设置为您需要的值，但有一点间距是好的；）