Question

<div class="control-group">
    <label for="name" class="control-label"><p class="text-info">Name&nbsp;<i class="icon-star"></i></p></label>
    <div class="controls">
        <input type="text" id="name" placeholder="Enter your name" class="span3">
    </div>

这对我不起作用，我不想使用'form-horizontal'类或表格。我尝试过使用row和row-fluid类，但它没有工作。

Answer 1

您可以使用<div class="form-horizontal">包装代码。您无需form即可使用form-horizontal。

Example：

<div class="form-horizontal">
    <div class="control-group row-fluid form-inline">
        <label for="name" class="control-label"><p class="text-info">Name&nbsp;<i class="icon-star"></i></p></label>
        <div class="controls">
            <input type="text" id="name" placeholder="Enter your name" class="span3">
        </div>
    </div>
</div>

Answer 2

您需要水平表单布局。这可以通过将代码包装在具有类形式为水平的div之间来实现。

<div class="form-horizontal">
   <div class="control-group">
    <label for="name" class="control-label"><p class="text-info">Name&nbsp;<i class="icon-star"></i></p></label>
    <div class="controls">
        <input type="text" id="name" placeholder="Enter your name" class="span3">
    </div>
</div>

要了解详情，请点击here

如何使用Twitter Bootstrap在同一行中显示标签和文本框

2 个答案: