在选择内部输入组的顶部显示跨度

Question

在输入组中是否有任何方式将跨度放在顶部而不是左侧？

我希望它是这样的：

Title
line_1
line_2
line_3

我尝试用div.input-group包装span但是span和select不再在一起，它们是分开的。

这是html代码：

<div class="input-group">
    <span class="input-group-addon">Title</span>
    <select class="form-control" multiple="multiple" size="3">
        <option value="line_1">line_1</option>
        <option value="line_1">line_2</option>
        <option value="line_1">line_3</option>
    </select>
</div>

Here is a JSFiddle example

Answer 1

span是一个内联元素，如文本，输入，选择等。因此它除了选择之外还添加了。 如果您希望跨度位于选择之上，则需要：

1. 仅使用div
换行
2. 使跨度为div
3. 使跨度显示：阻止;

Answer 2

bootstrap input-group-addon类将元素放在该位置。如果您不想要默认的引导行为，则需要覆盖它（通常使用!important作为css声明的一部分）或从元素中删除引导类。

删除类并设置为阻止： http://jsfiddle.net/c60h2z0v/1/